ਆਪਣੀ ਮਾਰਜਿਨਸ ਅਤੇ ਬਾਰਡਰਸ ਨੂੰ ਜ਼ੀਰੋ ਕਰਨ ਲਈ CSS ਦੀ ਵਰਤੋਂ ਕਰੋ

ਅੱਜ ਦੇ ਵੈਬ ਬ੍ਰਾਉਜ਼ਰ ਨੂੰ ਭਿਆਨਕ ਦਿਨਾਂ ਤੋਂ ਬਹੁਤ ਲੰਮਾ ਰਾਹ ਮਿਲ ਗਿਆ ਹੈ ਜਿਥੇ ਕਿਸੇ ਵੀ ਕਿਸਮ ਦੀ ਕਰਾਸ-ਬ੍ਰਾਉਜ਼ਰ ਅਨੁਕੂਲਤਾ ਸੋਚਣ ਵਾਲੀ ਸੋਚ ਸੀ. ਅੱਜ ਦੇ ਵੈੱਬ ਬਰਾਊਜ਼ਰ ਸਾਰੇ ਬਹੁਤ ਹੀ ਮਿਆਰ-ਅਨੁਕੂਲ ਹਨ. ਉਹ ਚੰਗੀ ਤਰ੍ਹਾਂ ਇਕੱਠੇ ਖੇਡਦੇ ਹਨ ਅਤੇ ਵੱਖ ਵੱਖ ਬ੍ਰਾਉਜ਼ਰ ਭਰ ਵਿੱਚ ਇੱਕਸਾਰ ਅਨੁਕੂਲ ਪੰਨਾ ਡਿਸਪਲੇਅ ਪ੍ਰਦਾਨ ਕਰਦੇ ਹਨ. ਇਸ ਵਿੱਚ ਗੂਗਲ ਕਰੋਮ, ਮਾਈਕਰੋਸੋਫਟ ਐਜਗੇ, ਮੋਜ਼ੀਲਾ ਫਾਇਰਫਾਕਸ, ਓਪੇਰਾ, ਸਫਾਰੀ, ਅਤੇ ਵੈਬਸਾਈਟ ਨੂੰ ਐਕਸੈਸ ਕਰਨ ਲਈ ਵਰਤਿਆ ਜਾ ਰਿਹਾ ਮੋਬਾਈਲ ਡਿਵਾਈਸਿਸ ਦੇ ਅਣਗਿਣਤ ਲੱਭੇ ਗਏ ਵੱਖ-ਵੱਖ ਬ੍ਰਾਉਜ਼ਰਸ ਸ਼ਾਮਲ ਹਨ.

ਜਦੋਂ ਵੈਬ ਬ੍ਰਾਉਜ਼ਰ ਦੀ ਗੱਲ ਆਉਂਦੀ ਹੈ ਅਤੇ ਉਹ CSS ਨੂੰ ਕਿਵੇਂ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਦੇ ਹਨ ਤਾਂ ਨਿਸ਼ਚਿਤ ਰੂਪ ਨਾਲ ਤਰੱਕੀ ਕੀਤੀ ਗਈ ਹੈ, ਹਾਲਾਂਕਿ ਇਹਨਾਂ ਵੱਖ-ਵੱਖ ਸੌਫਟਵੇਅਰ ਵਿਕਲਪਾਂ ਵਿਚਕਾਰ ਅਸੰਗਤਾ ਅਜੇ ਵੀ ਹੈ. ਇਕ ਆਮ ਅਸੰਗਤਤਾ ਇਹ ਹੈ ਕਿ ਉਹ ਬ੍ਰਾਉਜ਼ਰ ਮੂਲ ਰੂਪ ਵਿੱਚ ਮਾਰਜਿਨ, ਪੈਡਿੰਗ ਅਤੇ ਬਾਰਡਰ ਦੀ ਗਣਨਾ ਕਰਦੇ ਹਨ.

ਬੌਕਸ ਮਾੱਡਲ ਦੇ ਇਹਨਾਂ ਪਹਿਲੂਆਂ ਦੇ ਕਾਰਨ ਸਾਰੇ HTML ਤੱਤ ਪ੍ਰਭਾਵਿਤ ਹੁੰਦੇ ਹਨ, ਅਤੇ ਕਿਉਂਕਿ ਉਹ ਪੇਜ਼ ਲੇਆਉਟ ਬਣਾਉਣ ਲਈ ਜ਼ਰੂਰੀ ਹਨ, ਇੱਕ ਅਸੰਗਤ ਡਿਸਪਲੇ ਕਰਨ ਦਾ ਮਤਲਬ ਹੈ ਕਿ ਇੱਕ ਸਫ਼ਾ ਇੱਕ ਬ੍ਰਾਉਜ਼ਰ ਵਿੱਚ ਬਹੁਤ ਵਧੀਆ ਦਿੱਸ ਸਕਦਾ ਹੈ, ਪਰ ਦੂਜੇ ਵਿੱਚ ਥੋੜ੍ਹਾ ਨਜ਼ਰੀਆ ਇਸ ਸਮੱਸਿਆ ਦਾ ਮੁਕਾਬਲਾ ਕਰਨ ਲਈ, ਬਹੁਤ ਸਾਰੇ ਵੈਬ ਡਿਜ਼ਾਇਨਰ ਬਾਕਸ ਮਾੱਡਲ ਦੇ ਇਹਨਾਂ ਪਹਿਲੂਆਂ ਦੇ ਅਨੁਕੂਲ ਹਨ. ਇਸ ਅਭਿਆਸ ਨੂੰ ਮਾਰਜਿਨ, ਪੈਡਿੰਗ ਅਤੇ ਬਾਰਡਰਸ ਦੇ ਮੁੱਲਾਂ ਨੂੰ "zeroing out" ਵਜੋਂ ਵੀ ਜਾਣਿਆ ਜਾਂਦਾ ਹੈ.

ਬ੍ਰਾਉਜ਼ਰ ਡਿਫਾਲਟ ਤੇ ਇੱਕ ਨੋਟ

ਵੈਬ ਬ੍ਰਾਉਜ਼ਰਾਂ ਕੋਲ ਇੱਕ ਪੇਜ਼ ਦੇ ਖਾਸ ਡਿਸਪਲੇਅ ਪਹਿਲੂਆਂ ਲਈ ਡਿਫਾਲਟ ਸੈਟਿੰਗਜ਼ ਹੁੰਦੀਆਂ ਹਨ. ਉਦਾਹਰਣ ਦੇ ਲਈ, ਹਾਈਪਰਲਿੰਕ ਨੀਲੇ ਹੁੰਦੇ ਹਨ ਅਤੇ ਡਿਫੌਲਟ ਤੇ ਅੰਡਰਲਾਈਨ ਹੋ ਜਾਂਦੇ ਹਨ. ਇਹ ਵੱਖ-ਵੱਖ ਬ੍ਰਾਉਜ਼ਰ ਭਰ ਵਿੱਚ ਇਕਸਾਰ ਹੈ, ਅਤੇ ਭਾਵੇਂ ਇਹ ਕੁਝ ਅਜਿਹਾ ਹੈ ਜੋ ਜ਼ਿਆਦਾਤਰ ਡਿਜ਼ਾਇਨਰ ਆਪਣੀ ਖਾਸ ਪ੍ਰੋਜੈਕਟ ਦੀਆਂ ਡਿਜ਼ਾਈਨ ਲੋੜਾਂ ਮੁਤਾਬਕ ਬਦਲਦੇ ਹਨ, ਇਹ ਤੱਥ ਕਿ ਇਹ ਸਾਰੇ ਉਸੇ ਡਿਫੌਲਟ ਨਾਲ ਸ਼ੁਰੂ ਹੋ ਰਹੇ ਹਨ, ਇਹਨਾਂ ਬਦਲਾਵਾਂ ਨੂੰ ਸੌਖਾ ਬਣਾਉਣਾ ਸੌਖਾ ਬਣਾਉਂਦਾ ਹੈ. ਦੁੱਖ ਦੀ ਗੱਲ ਹੈ ਕਿ, ਹਾਸ਼ੀਆ, ਪੈਡਿੰਗ ਅਤੇ ਬਾਰਡਰ ਲਈ ਡਿਫਾਲਟ ਮੁੱਲ ਕ੍ਰੌਸ-ਬ੍ਰਾਊਜ਼ਰ ਇਕਸਾਰਤਾ ਦੇ ਇੱਕੋ ਪੱਧਰ ਦਾ ਆਨੰਦ ਨਹੀਂ ਮਾਣਦੇ.

ਮਾਰਜਿਨ ਅਤੇ ਪੈਡਿੰਗ ਲਈ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਨੂੰ ਸਧਾਰਣ ਕਰਨਾ

ਅਸੰਗਤ ਬਾਕਸ ਮਾੱਡਲ ਦੀ ਸਮੱਸਿਆ ਨੂੰ ਹੱਲ ਕਰਨ ਦਾ ਸਭ ਤੋਂ ਵਧੀਆ ਤਰੀਕਾ ਹੈ ਕਿ HTML ਦੇ ਤੱਤਾਂ ਨੂੰ ਸਾਰੇ ਸਿਧਾਂਤ ਅਤੇ ਪੈਡਿੰਗ ਦੇ ਮੁੱਲਾਂ ਨੂੰ ਜ਼ੀਰੋ ਤੇ ਸੈੱਟ ਕਰਨਾ. ਕੁਝ ਅਜਿਹਾ ਤਰੀਕਾ ਹਨ ਜੋ ਤੁਸੀਂ ਕਰ ਸਕਦੇ ਹੋ ਇਸ ਸਟਾਈਲਸ਼ੀਟ ਵਿੱਚ ਇਹ CSS ਨਿਯਮ ਜੋੜਨਾ:

* {ਹਾਸ਼ੀਆ: 0; ਪੈਡਿੰਗ: 0; }

ਇਹ CSS ਨਿਯਮ * ਜਾਂ ਵਾਈਲਡਕਾਰਡ ਅੱਖਰ ਵਰਤਦਾ ਹੈ ਇਹ ਅੱਖਰ ਦਾ ਅਰਥ ਹੈ "ਸਾਰੇ ਤੱਤ" ਅਤੇ ਇਹ ਅਸਲ ਵਿੱਚ ਹਰੇਕ HTML ਤੱਤ ਦੀ ਚੋਣ ਕਰੇਗਾ ਅਤੇ ਮਾਰਜਿਨ ਅਤੇ ਪੈਡਿੰਗ ਨੂੰ 0 ਤੇ ਸੈਟ ਕਰੇਗਾ. ਹਾਲਾਂਕਿ ਇਹ ਨਿਯਮ ਬਹੁਤ ਹੀ ਅਨਿਸ਼ਚਿਤ ਹੈ, ਕਿਉਂਕਿ ਇਹ ਤੁਹਾਡੇ ਬਾਹਰੀ ਸਟਾਈਲਸ਼ੀਟ ਵਿੱਚ ਹੈ, ਇਸ ਵਿੱਚ ਡਿਫੌਲਟ ਬ੍ਰਾਊਜ਼ਰ ਨਾਲੋਂ ਵੱਧ ਵਿਸ਼ੇਸ਼ਤਾ ਹੋਵੇਗੀ ਮੁੱਲ ਕਰਦੇ ਹਨ. ਕਿਉਂਕਿ ਉਹ ਡਿਫਾਲਟ ਉਹ ਹਨ ਜੋ ਤੁਸੀਂ ਓਵਰਰਾਈਟ ਕਰਦੇ ਹੋ, ਇਹ ਇੱਕ ਸ਼ੈਲੀ ਉਹ ਕੰਮ ਪੂਰਾ ਕਰੇਗਾ ਜੋ ਤੁਸੀਂ ਕਰਨਾ ਚਾਹੁੰਦੇ ਹੋ.

ਇਕ ਹੋਰ ਵਿਕਲਪ ਹੈ ਇਹਨਾਂ ਮੁੱਲਾਂ ਨੂੰ HTML ਅਤੇ ਸਰੀਰ ਦੇ ਤੱਤਾਂ ਤੇ ਲਾਗੂ ਕਰਨਾ. ਕਿਉਂਕਿ ਤੁਹਾਡੇ ਪੰਨਿਆਂ ਤੇ ਹੋਰ ਸਾਰੇ ਤੱਤ ਇਨ੍ਹਾਂ ਦੋ ਤੱਤਾਂ ਦੇ ਬੱਚੇ ਹੋਣਗੇ, CSS ਕੈਸਕੇਡ ਨੂੰ ਇਨ੍ਹਾਂ ਸਾਰੇ ਹੋਰ ਤੱਤਾਂ ਨੂੰ ਲਾਗੂ ਕਰਨਾ ਚਾਹੀਦਾ ਹੈ.

html, body {ਹਾਸ਼ੀਆ: 0; ਪੈਡਿੰਗ: 0; }

ਇਹ ਤੁਹਾਡੇ ਡਿਜ਼ਾਈਨ ਨੂੰ ਉਸੇ ਥਾਂ ਤੇ ਸਾਰੇ ਬ੍ਰਾਉਜ਼ਰਸ ਤੇ ਸ਼ੁਰੂ ਕਰੇਗਾ, ਪਰ ਇੱਕ ਗੱਲ ਯਾਦ ਰੱਖਣ ਵਾਲੀ ਗੱਲ ਇਹ ਹੈ ਕਿ ਇੱਕ ਵਾਰ ਜਦੋਂ ਤੁਸੀਂ ਸਾਰੇ ਮਾਰਜਿਨਾਂ ਅਤੇ ਪੈਡਿੰਗ ਨੂੰ ਬੰਦ ਕਰ ਦਿੰਦੇ ਹੋ, ਤੁਹਾਨੂੰ ਆਪਣੇ ਵੈਬ ਪੇਜ ਦੇ ਖਾਸ ਹਿੱਸਿਆਂ ਲਈ ਚੋਣਵੇਂ ਰੂਪ ਵਿੱਚ ਉਹਨਾਂ ਨੂੰ ਚੋਣਵੇਂ ਰੂਪ ਵਿੱਚ ਬਦਲਣ ਦੀ ਜ਼ਰੂਰਤ ਹੋਵੇਗੀ ਅਤੇ ਮਹਿਸੂਸ ਕਰੋ ਕਿ ਤੁਹਾਡੇ ਡਿਜ਼ਾਈਨ ਲਈ ਕਾਲਾਂ ਹਨ.

ਬਾਰਡਰ

ਤੁਸੀਂ ਸ਼ਾਇਦ ਸੋਚ ਰਹੇ ਹੋਵੋ "ਪਰ ਕੋਈ ਬ੍ਰਾਉਜ਼ਰ ਦੀ ਬੌਡੀ ਦੇ ਦੁਆਲੇ ਕੋਈ ਨਿਯੰਤਰਣ ਬਾਹਰੀ ਨਹੀਂ ਹੈ". ਇਹ ਬਿਲਕੁਲ ਸੱਚ ਨਹੀਂ ਹੈ. ਇੰਟਰਨੈਟ ਐਕਸਪਲੋਰਰ ਦੇ ਪੁਰਾਣੇ ਵਰਜਨਾਂ ਕੋਲ ਤੱਤ ਦੇ ਦੁਆਲੇ ਇੱਕ ਪਾਰਦਰਸ਼ੀ ਜਾਂ ਅਦਿੱਖ ਹੱਦ ਹੈ. ਜਦੋਂ ਤੱਕ ਤੁਸੀਂ ਸਰਹੱਦ 0 ਤੱਕ ਨਹੀਂ ਸੈੱਟ ਕਰੋ, ਉਹ ਬਾਰਡਰ ਤੁਹਾਡੇ ਪੇਜ ਲੇਆਉਟ ਨੂੰ ਉਲਝਣ ਕਰ ਸਕਦਾ ਹੈ. ਜੇ ਤੁਸੀਂ ਇਹ ਫੈਸਲਾ ਕੀਤਾ ਹੈ ਕਿ ਤੁਸੀਂ IE ਦੇ ਇਹਨਾਂ ਪੁਰਾਣਾ ਵਰਜਨਾਂ ਦਾ ਸਮਰਥਨ ਕਰਨਾ ਜਾਰੀ ਰੱਖੋਂਗੇ, ਤਾਂ ਤੁਹਾਨੂੰ ਆਪਣੇ ਸਰੀਰ ਅਤੇ HTML ਸਟਾਈਲਾਂ ਨੂੰ ਹੇਠਾਂ ਜੋੜ ਕੇ ਇਸਦਾ ਹੱਲ ਕਰਨ ਦੀ ਲੋੜ ਹੋਵੇਗੀ:

HTML, ਸਰੀਰ {
ਹਾਸ਼ੀਆ: 0 ਪੈਕਸ;
ਪੈਡਿੰਗ: 0 ਪੈਕਸ;
ਬਾਰਡਰ: 0 ਪੈਕਸ;
}

ਇਸੇ ਤਰ੍ਹਾਂ ਕਿ ਤੁਸੀਂ ਮਾਰਜਿਨ ਅਤੇ ਪੈਡਿੰਗ ਨੂੰ ਬੰਦ ਕਰ ਦਿੱਤਾ, ਇਹ ਨਵੀਂ ਸਟਾਈਲ ਡਿਫਾਲਟ ਬਾਰਡਰਸ ਨੂੰ ਬੰਦ ਕਰ ਦੇਵੇਗਾ. ਤੁਸੀਂ ਪਿਛਲੇ ਲੇਖ ਵਿਚ ਦਿਖਾਇਆ ਗਿਆ ਵਾਈਲਡਕਾਰਡ ਚੋਣਕਾਰ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਵੀ ਅਜਿਹਾ ਕਰ ਸਕਦੇ ਹੋ.

ਜੈਨੀਫਰ ਕ੍ਰਿਨਿਨ ਦੁਆਰਾ ਮੂਲ ਲੇਖ. 9/27/16 ਨੂੰ ਜੈਰੀਮੀ ਗਿਰਾਰਡ ਦੁਆਰਾ ਸੰਪਾਦਿਤ