CSS ਫਰੇਮਵਰਕ ਸੰਖੇਪ

CSS ਫਰੇਮਵਰਕ ਸੰਖੇਪ

ਏਲੀਮੈਂਟ ਬਕਸ ਦਾ ਸਭ ਤੋਂ ਅੰਦਰੂਨੀ ਹਿੱਸਾ ਵਾਸਤਵਿਕ ਕੰਟੈਂਟ ਹੈ, ਜਿਸ ਦੇ ਆਸਪਾਸ ਪੈਡਿੰਗ ਹੈ। ਪੈਡਿੰਗ ਦੇ ਪਿੱਛੇ ਪਿੱਨ ਪੇਸ਼ ਕਰਦਾ ਹੈ। ਪੈਡਿੰਗ ਦੇ ਬਾਹਰ ਬੋਰਡਰ ਹੈ। ਬੋਰਡਰ ਦੇ ਬਾਹਰ ਬਾਹਰੀ ਮਾਰਜਿਨ ਹੈ, ਜਿਸ ਦਾ ਮੂਲ ਰੰਗ ਪਾਰਦਰਸ਼ੀ ਹੈ, ਇਸ ਲਈ ਉਹ ਆਪਣੇ ਬਾਅਦ ਦੇ ਏਲੀਮੈਂਟਾਂ ਨੂੰ ਨਾਕਲ ਨਹੀਂ ਕਰਦਾ।

ਸੁਝਾਅ:ਪਿੱਨ ਦਾ ਪ੍ਰਯੋਗ ਕੰਟੈਂਟ, ਪੈਡਿੰਗ ਅਤੇ ਬੋਰਡਰ ਦੇ ਬਣਾਏ ਖੇਤਰ 'ਤੇ ਕੀਤਾ ਜਾਂਦਾ ਹੈ。

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

* {
  margin: 0;
  padding: 0;
}

CSS ਵਿੱਚ, width ਅਤੇ height ਕੰਟੈਂਟ ਰੀਜਨ ਦੀ ਚੌੜਾਈ ਅਤੇ ਉਚਾਈ ਦਾ ਮਤਲਬ ਹੁੰਦੇ ਹਨ। ਪੈਡਿੰਗ, ਬੋਰਡਰ ਅਤੇ ਬਾਹਰੀ ਮਾਰਜਿਨ ਵਧਾਉਣ ਨਾਲ ਕੰਟੈਂਟ ਰੀਜਨ ਦੀ ਸਾਈਜ਼ ਨੂੰ ਪ੍ਰਭਾਵਿਤ ਨਹੀਂ ਕਰਦਾ, ਪਰ ਏਲੀਮੈਂਟ ਬਕਸ ਦੀ ਸਮੂਹਿਕ ਸਾਈਜ਼ ਵਧਾਉਂਦਾ ਹੈ。

ਇਕਸਾਰ ਬਕਸ ਦੇ ਹਰੇਕ ਪਾਸੇ 'ਤੇ 10 ਪਿਕਸਲ ਬਾਹਰੀ ਮਾਰਜਿਨ ਅਤੇ 5 ਪਿਕਸਲ ਪੈਡਿੰਗ ਹੋਣ ਦੀ ਧਾਰਨਾ ਕਰੋ। ਜੇਕਰ ਤੁਸੀਂ ਇਸ ਏਲੀਮੈਂਟ ਬਕਸ ਨੂੰ 100 ਪਿਕਸਲ ਚੌੜਾਈ ਹੋਣ ਦੀ ਇੱਛਾ ਕਰਦੇ ਹੋ, ਤਾਂ ਕੰਟੈਂਟ ਦੀ ਚੌੜਾਈ ਨੂੰ 70 ਪਿਕਸਲ ਸੈਟ ਕਰਨਾ ਹੋਵੇਗਾ, ਅੱਗੇ ਦੀ ਤਸਵੀਰ ਦੇਖੋ:

#box {
  width: 70px;
  margin: 10px;
  padding: 5px;
}

ਸੁਝਾਅ:ਪੈਡਿੰਗ, ਬੋਰਡਰ ਅਤੇ ਬਾਹਰੀ ਮਾਰਜਿਨ ਇੱਕ ਏਲੀਮੈਂਟ ਦੇ ਸਾਰੇ ਪਾਸੇ 'ਤੇ ਅਤੇ ਸਿਰਫ਼ ਇੱਕ ਪਾਸੇ 'ਤੇ ਵੀ ਲਾਗੂ ਕੀਤੇ ਜਾ ਸਕਦੇ ਹਨ。

ਸੁਝਾਅ:ਬਾਹਰੀ ਮਾਰਜਿਨ ਨੂੰ ਨੈਗਾਟਿਵ ਮੁੱਲ ਹੋ ਸਕਦਾ ਹੈ ਅਤੇ ਕਈ ਸਥਿਤੀਆਂ ਵਿੱਚ ਨੈਗਾਟਿਵ ਮਾਰਜਿਨ ਦੀ ਵਰਤੋਂ ਕੀਤੀ ਜਾਂਦੀ ਹੈ。