Source

ਲੇਆਉਟ ਲਈ ਉਪਯੋਗਤਾਵਾਂ

ਤੇਜ਼ ਮੋਬਾਈਲ-ਅਨੁਕੂਲ ਅਤੇ ਜਵਾਬਦੇਹ ਵਿਕਾਸ ਲਈ, ਬੂਟਸਟਰੈਪ ਵਿੱਚ ਸਮੱਗਰੀ ਨੂੰ ਦਿਖਾਉਣ, ਲੁਕਾਉਣ, ਅਲਾਈਨ ਕਰਨ ਅਤੇ ਸਪੇਸ ਰੱਖਣ ਲਈ ਦਰਜਨਾਂ ਉਪਯੋਗੀ ਕਲਾਸਾਂ ਸ਼ਾਮਲ ਹਨ।

ਬਦਲ ਰਿਹਾdisplay

ਸੰਪਤੀ ਦੇ ਸਾਂਝੇ ਮੁੱਲਾਂ ਨੂੰ ਜਵਾਬਦੇਹ ਢੰਗ ਨਾਲ ਟੌਗਲ ਕਰਨ ਲਈ ਸਾਡੀ ਡਿਸਪਲੇ ਯੂਟਿਲਟੀਜ਼ ਦੀ ਵਰਤੋਂ ਕਰੋ। displayਇਸ ਨੂੰ ਸਾਡੇ ਗਰਿੱਡ ਸਿਸਟਮ, ਸਮਗਰੀ, ਜਾਂ ਭਾਗਾਂ ਨਾਲ ਮਿਲਾਓ ਤਾਂ ਜੋ ਉਹਨਾਂ ਨੂੰ ਖਾਸ ਵਿਊਪੋਰਟਾਂ ਵਿੱਚ ਦਿਖਾਉਣ ਜਾਂ ਲੁਕਾਇਆ ਜਾ ਸਕੇ।

ਫਲੈਕਸਬਾਕਸ ਵਿਕਲਪ

ਬੂਟਸਟਰੈਪ 4 ਫਲੈਕਸਬਾਕਸ ਨਾਲ ਬਣਾਇਆ ਗਿਆ ਹੈ, ਪਰ ਹਰ ਤੱਤ displayਨੂੰ ਬਦਲਿਆ ਨਹੀਂ ਗਿਆ ਹੈ display: flexਕਿਉਂਕਿ ਇਹ ਬਹੁਤ ਸਾਰੇ ਬੇਲੋੜੇ ਓਵਰਰਾਈਡਾਂ ਨੂੰ ਜੋੜ ਦੇਵੇਗਾ ਅਤੇ ਅਚਾਨਕ ਮੁੱਖ ਬ੍ਰਾਊਜ਼ਰ ਵਿਵਹਾਰ ਨੂੰ ਬਦਲ ਦੇਵੇਗਾ। ਸਾਡੇ ਜ਼ਿਆਦਾਤਰ ਹਿੱਸੇ flexbox ਸਮਰਥਿਤ ਨਾਲ ਬਣਾਏ ਗਏ ਹਨ।

ਕੀ ਤੁਹਾਨੂੰ display: flexਕਿਸੇ ਤੱਤ ਵਿੱਚ ਸ਼ਾਮਲ ਕਰਨ ਦੀ ਲੋੜ ਹੈ, ਅਜਿਹਾ .d-flexਜਵਾਬਦੇਹ ਰੂਪਾਂ ਵਿੱਚੋਂ ਇੱਕ ਨਾਲ ਕਰੋ (ਉਦਾਹਰਨ ਲਈ, .d-sm-flex)। ਆਕਾਰ, ਅਲਾਈਨਮੈਂਟ, ਸਪੇਸਿੰਗ, ਅਤੇ ਹੋਰ ਬਹੁਤ ਕੁਝ ਲਈ ਸਾਡੀਆਂ ਵਾਧੂ ਫਲੈਕਸਬਾਕਸ ਉਪਯੋਗਤਾਵਾਂ ਦੀ ਵਰਤੋਂ ਕਰਨ ਦੀ ਇਜਾਜ਼ਤ ਦੇਣ ਲਈ ਤੁਹਾਨੂੰ ਇਸ ਸ਼੍ਰੇਣੀ ਜਾਂ displayਮੁੱਲ ਦੀ ਲੋੜ ਪਵੇਗੀ।

ਮਾਰਜਿਨ ਅਤੇ ਪੈਡਿੰਗ

marginਇਹ ਨਿਯੰਤਰਣ ਕਰਨ ਲਈ ਅਤੇ padding ਸਪੇਸਿੰਗ ਉਪਯੋਗਤਾਵਾਂ ਦੀ ਵਰਤੋਂ ਕਰੋ ਕਿ ਤੱਤ ਅਤੇ ਭਾਗਾਂ ਨੂੰ ਕਿਵੇਂ ਵਿੱਥ ਅਤੇ ਆਕਾਰ ਦਿੱਤਾ ਜਾਂਦਾ ਹੈ। 1remਬੂਟਸਟਰੈਪ 4 ਵਿੱਚ ਵੈਲਯੂ ਡਿਫੌਲਟ $spacerਵੇਰੀਏਬਲ ਦੇ ਅਧਾਰ ਤੇ, ਸਪੇਸਿੰਗ ਉਪਯੋਗਤਾਵਾਂ ਲਈ ਇੱਕ ਪੰਜ-ਪੱਧਰ ਦਾ ਪੈਮਾਨਾ ਸ਼ਾਮਲ ਹੁੰਦਾ ਹੈ। ਸਾਰੇ ਵਿਊਪੋਰਟਾਂ ਲਈ ਮੁੱਲ ਚੁਣੋ (ਉਦਾਹਰਨ ਲਈ, .mr-3ਲਈ margin-right: 1rem), ਜਾਂ ਖਾਸ ਵਿਊਪੋਰਟਾਂ ਨੂੰ ਨਿਸ਼ਾਨਾ ਬਣਾਉਣ ਲਈ ਜਵਾਬਦੇਹ ਰੂਪਾਂ ਨੂੰ ਚੁਣੋ (ਉਦਾਹਰਨ .mr-md-3ਲਈ , ਬ੍ਰੇਕਪੁਆਇੰਟ margin-right: 1remਤੋਂ ਸ਼ੁਰੂ ਕਰਨ ਲਈ)।md

ਟੌਗਲ ਕਰੋvisibility

ਜਦੋਂ ਟੌਗਲ ਕਰਨ ਦੀ ਲੋੜ ਨਾ ਹੋਵੇ, ਤਾਂ ਤੁਸੀਂ ਸਾਡੀ ਦਿੱਖ ਉਪਯੋਗਤਾਵਾਂ ਨਾਲ ਕਿਸੇ ਤੱਤ ਨੂੰ displayਟੌਗਲ ਕਰ ਸਕਦੇ ਹੋ । ਅਦਿੱਖ ਤੱਤ ਅਜੇ ਵੀ ਪੰਨੇ ਦੇ ਖਾਕੇ ਨੂੰ ਪ੍ਰਭਾਵਿਤ ਕਰਨਗੇ, ਪਰ ਵਿਜ਼ਟਰਾਂ ਤੋਂ ਦ੍ਰਿਸ਼ਟੀਗਤ ਤੌਰ 'ਤੇ ਲੁਕੇ ਹੋਏ ਹਨ।visibility