ਚਿੱਤਰ ਦੇ ਦੁਆਲੇ ਪਾਠ ਨੂੰ ਕਿਵੇਂ ਸਮੇਟਣਾ ਹੈ

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

ਵੈਬਸਾਈਟ ਤੇ ਪਾਠ ਅਤੇ ਚਿੱਤਰ ਜੋੜਨਾ ਆਸਾਨ ਹੈ. ਪਾਠ ਨੂੰ ਮਿਆਰੀ HTML ਟੈਗਾਂ ਜਿਵੇਂ ਪੈਰਾਗਰੀਆਂ, ਹੈਡਿੰਗਸ ਅਤੇ ਸੂਚੀਆਂ ਨਾਲ ਜੋੜਿਆ ਗਿਆ ਹੈ, ਜਦੋਂ ਕਿ ਚਿੱਤਰਾਂ ਨੂੰ ਐਲੀਮੈਂਟ ਨਾਲ ਸਫ਼ੇ ਤੇ ਰੱਖਿਆ ਗਿਆ ਹੈ. ਇੱਕ ਵਾਰੀ ਜਦੋਂ ਤੁਸੀਂ ਆਪਣੇ ਵੈਬ ਪੇਜ ਤੇ ਇੱਕ ਚਿੱਤਰ ਜੋੜ ਲਿਆ ਹੈ, ਫਿਰ ਵੀ, ਤੁਸੀਂ ਇਸ ਤੋਂ ਹੇਠਾਂ ਇਕਸਾਰ ਨਾ ਹੋਣ ਦੀ ਬਜਾਏ ਚਿੱਤਰ ਦੇ ਅੱਗੇ ਟੈਕਸਟ ਦੇ ਪ੍ਰਵਾਹ ਚਾਹੋਗੇ (ਜੋ ਕਿ ਡਿਫੌਲਟ ਢੰਗ ਹੈ ਜੋ HTML ਕੋਡ ਵਿੱਚ ਜੋੜਿਆ ਗਿਆ ਇੱਕ ਚਿੱਤਰ ਬ੍ਰਾਉਜ਼ਰ ਵਿੱਚ ਪੇਸ਼ ਕਰੇਗਾ). ਤਕਨੀਕੀ ਤੌਰ ਤੇ, ਇਹ ਦੋ ਤਰੀਕੇ ਹਨ ਜਿਨ੍ਹਾਂ ਨੂੰ ਤੁਸੀਂ ਸੀ. ਐਸ. ਐਸ (ਸਿਫਾਰਸ ਕੀਤਾ) ਰਾਹੀਂ ਵਰਤ ਸਕਦੇ ਹੋ ਜਾਂ ਵਿਜ਼ੂਅਲ ਹਦਾਇਤਾਂ ਨੂੰ ਸਿੱਧੇ HTML ਵਿੱਚ ਜੋੜ ਕੇ (ਸਿਫਾਰਸ਼ ਨਹੀਂ ਕੀਤੀ ਜਾ ਸਕਦੀ, ਕਿਉਂਕਿ ਤੁਸੀਂ ਆਪਣੀ ਵੈੱਬਸਾਈਟ ਲਈ ਸ਼ੈਲੀ ਅਤੇ ਢਾਂਚਿਆਂ ਨੂੰ ਵੱਖਰਾ ਰੱਖਣਾ ਚਾਹੁੰਦੇ ਹੋ).

CSS ਦੀ ਵਰਤੋਂ

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

1. ਪਹਿਲਾਂ, ਆਪਣੀ ਤਸਵੀਰ ਨੂੰ ਆਪਣੇ ਵੈਬ ਪੇਜ ਤੇ ਜੋੜੋ. ਉਸ HTML ਤੋਂ ਕੋਈ ਵੀ ਦਿੱਖ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ (ਜਿਵੇਂ ਚੌੜਾਈ ਅਤੇ ਉਚਾਈ) ਨੂੰ ਬਾਹਰ ਕੱਢਣਾ ਯਾਦ ਰੱਖੋ. ਇਹ ਮਹੱਤਵਪੂਰਨ ਹੈ, ਖਾਸ ਕਰਕੇ ਇੱਕ ਜਵਾਬਦੇਹ ਵੈਬਸਾਈਟ ਲਈ ਜਿੱਥੇ ਚਿੱਤਰ ਦਾ ਆਕਾਰ ਬਰਾਊਜ਼ਰ ਦੇ ਅਧਾਰ ਤੇ ਵੱਖ-ਵੱਖ ਹੋਵੇਗਾ ਕੁਝ ਸਾੱਫਟਵੇਅਰ, ਜਿਵੇਂ ਅਡੋਬ ਡ੍ਰੀਮਵਾਇਰ, ਉਨ੍ਹਾਂ ਸਾਧਨਾਂ ਨੂੰ ਚੌੜਾਈ ਅਤੇ ਉਚਾਈ ਵਾਲੀ ਜਾਣਕਾਰੀ ਨੂੰ ਜੋੜ ਦੇਵੇਗਾ ਜੋ ਉਸ ਸਾਧਨ ਦੇ ਨਾਲ ਪਾਏ ਜਾਂਦੇ ਹਨ, ਇਸ ਲਈ ਇਸ ਜਾਣਕਾਰੀ ਨੂੰ HTML ਕੋਡ ਤੋਂ ਹਟਾਉਣਾ ਯਕੀਨੀ ਬਣਾਓ! ਹਾਲਾਂਕਿ, ਉਚਿਤ alt ਟੈਕਸਟ ਨੂੰ ਸ਼ਾਮਲ ਕਰਨਾ ਯਕੀਨੀ ਬਣਾਓ ਇੱਥੇ ਤੁਹਾਡਾ HTML ਕੋਡ ਕਿਵੇਂ ਦਿਖਾਈ ਦੇ ਸਕਦਾ ਹੈ:
2. ਸਟਾਇਲ ਦੇ ਮਕਸਦ ਲਈ, ਤੁਸੀਂ ਇੱਕ ਚਿੱਤਰ ਨੂੰ ਇੱਕ ਕਲਾਸ ਵੀ ਜੋੜ ਸਕਦੇ ਹੋ. ਇਹ ਕਲਾਸ ਮੁੱਲ ਉਹ ਹੈ ਜੋ ਅਸੀਂ ਆਪਣੇ CSS ਫਾਇਲ ਵਿੱਚ ਵਰਤਾਂਗੇ. ਧਿਆਨ ਰੱਖੋ ਕਿ ਅਸੀਂ ਇੱਥੇ ਵਰਤੇ ਗਏ ਮੁੱਲ ਨੂੰ ਬੇਧਿਆਨੀ ਬਣਾਉਂਦੇ ਹਾਂ, ਹਾਲਾਂਕਿ, ਇਸ ਵਿਸ਼ੇਸ਼ ਸ਼ੈਲੀ ਲਈ, ਅਸੀਂ "ਖੱਬੇ" ਜਾਂ "ਸੱਜੇ" ਦੇ ਮੁੱਲਾਂ ਨੂੰ ਵਰਤਣ ਦੀ ਕੋਸ਼ਿਸ਼ ਕਰਦੇ ਹਾਂ, ਇਹ ਇਸ ਗੱਲ ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ ਕਿ ਅਸੀਂ ਕਿਸ ਤਰਾਂ ਚਿੱਤਰ ਨੂੰ ਇਕਸਾਰ ਕਰਨਾ ਚਾਹੁੰਦੇ ਹਾਂ. ਅਸੀਂ ਇਹ ਸਮਝਦੇ ਹਾਂ ਕਿ ਸਾਦਾ ਸਿੰਟੈਕਸ ਚੰਗੀ ਤਰ੍ਹਾਂ ਕੰਮ ਕਰਨ ਲਈ ਅਤੇ ਦੂਜਿਆਂ ਲਈ ਆਸਾਨ ਹੈ ਜਿਹਨਾਂ ਨੂੰ ਸਮਝਣ ਲਈ ਭਵਿੱਖ ਵਿੱਚ ਕਿਸੇ ਸਾਈਟ ਦਾ ਪ੍ਰਬੰਧ ਕਰਨਾ ਪੈ ਸਕਦਾ ਹੈ, ਪਰ ਤੁਸੀਂ ਇਸ ਨੂੰ ਕਿਸੇ ਵੀ ਕਲਾਸ ਦੇ ਮੁੱਲ ਨੂੰ ਦੇ ਸਕਦੇ ਹੋ ਜੋ ਤੁਸੀਂ ਚਾਹੁੰਦੇ ਹੋ
   2. ਆਪਣੇ ਆਪ ਹੀ, ਇਸ ਕਲਾਸ ਦਾ ਮੁੱਲ ਕੁਝ ਨਹੀਂ ਕਰੇਗਾ. ਚਿੱਤਰ ਨੂੰ ਪਾਠ ਦੇ ਖੱਬੇ ਪਾਸੇ ਆਪਣੇ ਆਪ ਹੀ ਨਹੀਂ ਰੱਖਿਆ ਜਾਵੇਗਾ. ਇਸ ਲਈ, ਸਾਨੂੰ ਹੁਣ ਸਾਡੇ CSS ਫਾਈਲ ਵਿੱਚ ਜਾਣ ਦੀ ਜਰੂਰਤ ਹੈ.

1. ਆਪਣੀ ਸਟਾਈਲਸ਼ੀਟ ਵਿੱਚ, ਤੁਸੀਂ ਹੁਣ ਅੱਗੇ ਦਿੱਤੀ ਸਟਾਈਲ ਨੂੰ ਜੋੜ ਸਕਦੇ ਹੋ:
   1. .left {
   2. ਫਲੋਟ: ਖੱਬੇ;
   3. ਪੈਡਿੰਗ: 0 20px 20px 0;
   4. }
   5. ਤੁਸੀਂ ਇੱਥੇ ਕੀ ਕੀਤਾ ਸੀ CSS "ਫਲੋਟ" ਦੀ ਜਾਇਦਾਦ ਦਾ ਇਸਤੇਮਾਲ ਕਰਦੇ ਹਨ , ਜੋ ਚਿੱਤਰ ਨੂੰ ਆਮ ਦਸਤਾਵੇਜ਼ ਪ੍ਰਵਾਹ ਤੋਂ ਖਿੱਚ ਦੇਵੇਗੀ (ਜਿਸ ਤਰ੍ਹਾਂ ਚਿੱਤਰ ਆਮ ਤੌਰ ਤੇ ਦਿਖਾਈ ਦੇਵੇਗੀ, ਉਸ ਦੇ ਹੇਠਾਂ ਹੋਏ ਟੈਕਸਟ ਨਾਲ) ਅਤੇ ਇਹ ਇਸ ਦੇ ਕੰਟੇਨਰ ਦੇ ਖੱਬੇ ਪਾਸੇ ਵੱਲ . ਜੋ ਪਾਠ ਇਸਦੇ ਬਾਅਦ HTML ਮਾਰਕਅੱਪ ਵਿੱਚ ਆਉਂਦੇ ਹਨ ਉਸਦੇ ਆਲੇ ਦੁਆਲੇ ਸਮੇਟਣਾ. ਅਸੀਂ ਕੁਝ ਪੈਡਿੰਗ ਵੈਲਯੂਆਂ ਨੂੰ ਵੀ ਜੋੜਿਆ ਹੈ ਤਾਂ ਕਿ ਇਹ ਟੈਕਸਟ ਚਿੱਤਰ ਦੇ ਵਿਰੁੱਧ ਸਿੱਧੇ ਹੀ ਨਾ ਕਰੇ. ਇਸ ਦੀ ਬਜਾਏ, ਇਸ ਵਿੱਚ ਕੁਝ ਵਧੀਆ ਸਪੇਸ ਹੋਵੇਗੀ ਜੋ ਪੇਜ ਦੇ ਡਿਜ਼ਾਇਨ ਵਿੱਚ ਅਸਹਿਜ ਦਿਖਾਈ ਦੇਵੇਗੀ. ਪੈਡਿੰਗ ਲਈ CSS ਸ਼ਾਰਟਹੈਂਡ ਵਿਚ, ਅਸੀਂ ਚਿੱਤਰ ਦੇ ਉੱਪਰ ਅਤੇ ਖੱਬੇ ਪਾਸੇ 0 ਮੁੱਲ ਜੋੜਿਆ ਹੈ, ਅਤੇ ਇਸਦੇ ਖੱਬੇ ਅਤੇ ਹੇਠਾਂ 20 ਪਿਕਸਲ ਜੋੜਿਆ ਹੈ. ਯਾਦ ਰੱਖੋ, ਤੁਹਾਨੂੰ ਇੱਕ ਖੱਬਾ ਗਠਿਤ ਚਿੱਤਰ ਦੇ ਸੱਜੇ ਪਾਸੇ ਕੁਝ ਪੈਡ ਪਾਉਣ ਦੀ ਲੋੜ ਹੈ. ਇਕ ਸੱਜੇ-ਖੂੰਹਦ ਚਿੱਤਰ (ਜਿਸ ਨੂੰ ਅਸੀਂ ਇਕ ਪਲ ਵਿਚ ਵੇਖਾਂਗੇ) ਦੇ ਪੈਡਿੰਗ ਨੂੰ ਇਸ ਦੇ ਖੱਬੇ ਪਾਸੇ ਲਾਗੂ ਕੀਤਾ ਜਾਵੇਗਾ.
2. ਜੇ ਤੁਸੀਂ ਆਪਣੇ ਵੈਬਪੇਜ ਨੂੰ ਕਿਸੇ ਬਰਾਊਜ਼ਰ ਵਿਚ ਵੇਖਦੇ ਹੋ, ਤਾਂ ਤੁਹਾਨੂੰ ਹੁਣ ਇਹ ਵੇਖਣਾ ਚਾਹੀਦਾ ਹੈ ਕਿ ਤੁਹਾਡੀ ਚਿੱਤਰ ਪੰਨੇ ਦੇ ਖੱਬੇ ਪਾਸਿਓਂ ਜੁੜੀ ਹੈ ਅਤੇ ਇਸਦੇ ਆਸਪਾਸ ਪਾਠ ਇਸਦੇ ਆਲੇ ਦੁਆਲੇ ਲਪੇਟਦਾ ਹੈ. ਇਹ ਕਹਿਣ ਦਾ ਇਕ ਹੋਰ ਤਰੀਕਾ ਇਹ ਹੈ ਕਿ ਚਿੱਤਰ ਨੂੰ "ਖੱਬੇ ਪਾਸੇ ਚਲਾਇਆ" ਹੈ.

1. ਜੇ ਤੁਸੀਂ ਇਸ ਤਸਵੀਰ ਨੂੰ ਸਹੀ (ਸੱਜੇ) ਜੋੜਨ ਲਈ ਤਬਦੀਲ ਕਰਨਾ ਚਾਹੁੰਦੇ ਹੋ (ਜਿਵੇਂ ਇਸ ਫੋਟੋ ਨਾਲ ਮਿਲਦਾ ਹੈ), ਇਹ ਸਧਾਰਨ ਹੋਵੇਗਾ. ਪਹਿਲਾਂ, ਤੁਹਾਨੂੰ ਇਹ ਯਕੀਨੀ ਬਣਾਉਣਾ ਚਾਹੀਦਾ ਹੈ ਕਿ, ਸਟਾਇਲ ਤੋਂ ਇਲਾਵਾ, ਅਸੀਂ "ਖੱਬੇ" ਦੇ ਕਲਾਸ ਮੁੱਲ ਲਈ ਆਪਣੇ CSS ਨੂੰ ਜੋੜਿਆ ਹੈ, ਸਾਡੇ ਕੋਲ ਸੱਜੇ-ਅਨੁਕੂਲਤਾ ਲਈ ਇੱਕ ਹੈ. ਇਹ ਇਸ ਤਰ੍ਹਾਂ ਦਿਖਾਈ ਦੇਵੇਗਾ:
   1. .right {
   2. ਫਲੋਟ: ਸੱਜੇ;
   3. ਪੈਡਿੰਗ: 0 20 20 ਸ਼ੀਸ਼ੇ 20px;
   4. }
   5. ਤੁਸੀਂ ਵੇਖ ਸਕਦੇ ਹੋ ਕਿ ਇਹ ਲਿਖਤ ਪਹਿਲੀ ਸੀ.ਆਈ.ਐਸ. ਇਕੋ ਇਕ ਅੰਤਰ ਉਹ ਮੁੱਲ ਹੈ ਜੋ ਅਸੀਂ "ਫਲੋਟ" ਜਾਇਦਾਦ ਅਤੇ ਸਾਡੇ ਦੁਆਰਾ ਵਰਤੇ ਗਏ ਪੈਡਿੰਗ ਮੁੱਲਾਂ ਲਈ ਵਰਤਦੇ ਹਾਂ (ਸੱਜੇ ਦੀ ਬਜਾਏ ਸਾਡੀ ਚਿੱਤਰ ਦੇ ਖੱਬੇ ਪਾਸੇ ਕੁਝ ਜੋੜਦੇ ਹੋਏ).
2. ਅੰਤ ਵਿੱਚ, ਤੁਸੀਂ ਆਪਣੇ HTML ਵਿੱਚ "ਖੱਬੇ" ਤੋਂ "ਸੱਜੇ" ਚਿੱਤਰ ਦੇ ਵਰਗ ਦੇ ਮੁੱਲ ਨੂੰ ਬਦਲ ਸਕਦੇ ਹੋ:
3. ਹੁਣੇ ਆਪਣੇ ਬ੍ਰਾਊਜ਼ਰ ਵਿਚ ਆਪਣੇ ਪੇਜ ਨੂੰ ਦੇਖੋ ਅਤੇ ਤੁਹਾਡੀ ਚਿੱਤਰ ਨੂੰ ਇਸਦੇ ਆਲੇ ਦੁਆਲੇ ਲਪੇਟਣ ਵਾਲੇ ਪਾਠ ਨਾਲ ਸੱਜੇ ਨਾਲ ਜੋੜਿਆ ਜਾਣਾ ਚਾਹੀਦਾ ਹੈ. ਅਸੀਂ ਇਨ੍ਹਾਂ ਸਟਾਈਲਸ਼ੀਟਾਂ ਨੂੰ "ਸਟ੍ਰਾਂਸ" ਅਤੇ "ਸੱਜੇ" ਦੋਵਾਂ ਨੂੰ ਜੋੜਦੇ ਹਾਂ ਤਾਂ ਜੋ ਅਸੀਂ ਇਹ ਵਿਜ਼ੂਅਲ ਸਟਾਈਲ ਵਰਤ ਸਕੀਏ ਜਦੋਂ ਅਸੀਂ ਵੈਬ ਪੇਜ ਬਣਾਵਾਂਗੇ. ਇਹ ਦੋ ਸਟਾਈਲ ਚੰਗੇ, ਰੀਯੂਜ਼ੇਬਲ ਫੀਚਰ ਬਣ ਜਾਂਦੀ ਹੈ ਜਦੋਂ ਅਸੀਂ ਤਸਵੀਰਾਂ ਨੂੰ ਉਹਨਾਂ ਦੇ ਆਲੇ ਦੁਆਲੇ ਦੇ ਪਾਠਾਂ ਨਾਲ ਢਕਣ ਲਈ ਵਰਤਦੇ ਹਾਂ.

CSS ਦੀ ਬਜਾਏ HTML ਦਾ ਇਸਤੇਮਾਲ ਕਰਨਾ (ਅਤੇ ਤੁਹਾਨੂੰ ਇਹ ਕਿਉਂ ਨਹੀਂ ਕਰਨਾ ਚਾਹੀਦਾ ਹੈ)

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