style boxSizing ਪ੍ਰਤੀਯੋਗਿਤਾ

ਵਿਆਖਿਆ ਅਤੇ ਵਰਤੋਂ

boxSizing ਪ੍ਰਤੀਯੋਗਿਤਾ ਤੁਹਾਨੂੰ ਇੱਕ ਵਿਸ਼ੇਸ਼ ਖੇਤਰ ਦੇ ਇੱਕ ਵਿਸ਼ੇਸ਼ ਏਲੀਮੈਂਟ ਨੂੰ ਵਿਸ਼ੇਸ਼ ਤਰੀਕੇ ਨਾਲ ਮਿਲਾਉਣ ਦੀ ਅਨੁਮਤੀ ਦਿੰਦੀ ਹੈ。

ਉਦਾਹਰਣ ਵਜੋਂ ਜੇਕਰ ਤੁਸੀਂ ਦੋ ਕਿਫਾਇਤ ਸਾਹਮਣੇ ਰੱਖਣ ਵਾਲੇ ਬਾਹਰੀ ਕਿਫਾਇਤ ਰੱਖਣ ਵਾਲੇ ਬਕਸੇ ਨੂੰ ਜੋੜਨਾ ਚਾਹੁੰਦੇ ਹੋ, ਤਾਂ box-sizing ਨੂੰ "border-box" ਮੁੱਲ 'ਤੇ ਸੈਟ ਕਰ ਸਕਦੇ ਹੋ। ਇਹ ਬਰਾਉਜ਼ਰ ਨੂੰ ਨਿਰਧਾਰਿਤ ਕੀਤੀ ਗਈ ਕਿਫਾਇਤ ਅਤੇ ਉਚਾਈ ਵਾਲੇ ਬਕਸੇ ਦਿਖਾਉਣਾ ਦਿੰਦਾ ਹੈ ਅਤੇ ਬਾਹਰੀ ਕਿਫਾਇਤ ਅਤੇ ਗੋਲਡਿੰਗ ਬਕਸ ਵਿੱਚ ਰੱਖਦਾ ਹੈ。

ਹੋਰ ਦੇਖੋ:

CSS ਪੁਸਤਕਾਲ:box-sizing ਪ੍ਰਤੀਯੋਗਿਤਾ

ਉਦਾਹਰਣ

boxSizing ਪ੍ਰਤੀਯੋਗਿਤਾ ਬਦਲੋ:

document.getElementById("myDIV").style.boxSizing = "border-box";

ਸਿੱਧੇ ਤੌਰ 'ਤੇ ਕੋਸ਼ਿਸ਼ ਕਰੋ

ਗਣਤਰ

boxSizing ਪ੍ਰਤੀਯੋਗਿਤਾ ਵਾਪਸੀ ਕਰੋ:

object.style.boxSizing

boxSizing ਪ੍ਰਤੀਯੋਗਿਤਾ ਸੈਟ ਕਰੋ:

object.style.boxSizing = "content-box|border-box|initial|inherit"

ਪ੍ਰਤੀਯੋਗਿਤਾ ਮੁੱਲ

ਮੁੱਲ ਵਰਣਨ
content-box

ਮੂਲਤਵੀ ਮੁੱਲ। ਇਹ ਸੀਐੱਸਐੱਸ2.1 ਵਿੱਚ ਨਿਰਧਾਰਿਤ ਕੀਤੀ ਗਈ ਕਿਫਾਇਤ ਅਤੇ ਉਚਾਈ ਦਾ ਵਿਵਹਾਰ ਹੈ。

ਨਿਰਧਾਰਿਤ ਕੀਤੀ ਗਈ ਕਿਫਾਇਤ ਅਤੇ ਉਚਾਈ (ਅਤੇ min/max ਪ੍ਰਤੀਯੋਗਿਤਾ) ਵਿਸ਼ਾਲਤਾ ਅਤੇ ਉਚਾਈ ਵਿੱਚ ਏਲੀਮੈਂਟ ਦੇ ਕੰਟੈਂਟ ਬਕਸ ਦੇ ਵਿੱਚ ਲਾਗੂ ਕੀਤੇ ਜਾਂਦੇ ਹਨ。

ਏਲੀਮੈਂਟ ਦੀ ਕਿਫਾਇਤ ਅਤੇ ਗੋਲਡਿੰਗ ਨਾਲ ਨਿਰਧਾਰਿਤ ਕੀਤੀ ਗਈ ਕਿਫਾਇਤ ਅਤੇ ਉਚਾਈ ਤੋਂ ਬਾਹਰ ਢਾਂਚੇ ਅਤੇ ਬਣਾਈ ਜਾਂਦੀ ਹੈ

border-box

ਏਲੀਮੈਂਟ ਲਈ ਨਿਰਧਾਰਿਤ ਕੀਤੀ ਗਈ ਕਿਫਾਇਤ ਅਤੇ ਉਚਾਈ ਏਲੀਮੈਂਟ ਦੇ ਬਾਹਰੀ ਬਕਸ ਦੇ ਨਿਰਧਾਰਕ ਹੁੰਦੇ ਹਨ。

ਯਾਨੀ ਕਿ ਏਲੀਮੈਂਟ ਲਈ ਨਿਰਧਾਰਿਤ ਕੀਤੀ ਗਈ ਕਿਫਾਇਤ ਅਤੇ ਗੋਲਡਿੰਗ ਚੁੱਕੇ ਵਿਸ਼ਾਲਤਾ ਅਤੇ ਉਚਾਈ ਵਿੱਚ ਬਣਾਈ ਜਾਵੇਗੀ。

ਵਾਪਸੀ ਮੁੱਲ ਦੇ ਚੁੱਕੇ ਵਿਸ਼ਾਲਤਾ ਅਤੇ ਉਚਾਈ ਤੋਂ ਬਾਹਰ ਕਿਫਾਇਤ ਅਤੇ ਗੋਲਡਿੰਗ ਤੋਂ ਉਹ ਕੰਟੈਂਟ ਦੀ ਵਿਸ਼ਾਲਤਾ ਅਤੇ ਉਚਾਈ ਪ੍ਰਾਪਤ ਕੀਤੀ ਜਾਂਦੀ ਹੈ。

initial ਇਹ ਪ੍ਰਤੀਯੋਗਿਤਾ ਆਪਣੇ ਮੂਲਤਵੀ ਮੁੱਲ 'ਤੇ ਸੈਟ ਕਰੋ। ਦੇਖੋ initial
inherit ਇਹ ਪ੍ਰਤੀਯੋਗਿਤਾ ਆਪਣੇ ਮਾਤਾ ਏਲੀਮੈਂਟ ਤੋਂ ਮਿਲਦੀ ਹੈ। ਦੇਖੋ inherit

ਤਕਨੀਕੀ ਵੇਰਵਾ

ਮੂਲਤਵੀ ਮੁੱਲ: content-box
ਵਾਪਸੀ ਮੁੱਲ: ਸਟਰਿੰਗ ਜੋ ਕਿ ਏਲੀਮੈਂਟ ਦਾ box-sizing ਪ੍ਰਤੀਯੋਗਿਤਾ
CSS ਵਰਜਨ: CSS3

ਬਰਾਉਜ਼ਰ ਸਮਰਥਨ

ਚਰਮੀ ਐਜ਼ਡ ਫਾਇਰਫਾਕਸ ਸਫਾਰੀ ਓਪਰਾ
ਚਰਮੀ ਐਜ਼ਡ ਫਾਇਰਫਾਕਸ ਸਫਾਰੀ ਓਪਰਾ
ਸਮਰਥਨ ਸਮਰਥਨ ਸਮਰਥਨ ਸਮਰਥਨ ਸਮਰਥਨ