CSS ਸਟਾਇਲ ਦੀਆਂ 3 ਕਿਸਮਾਂ ਨੂੰ ਸਮਝਣਾ

ਇਨਲਾਈਨ, ਏਮਬੈਡਡ, ਅਤੇ ਬਾਹਰੀ ਸਟਾਈਲ ਸ਼ੀਟ: ਇੱਥੇ ਤੁਹਾਨੂੰ ਕੀ ਜਾਣਨ ਦੀ ਜ਼ਰੂਰਤ ਹੈ

ਫਰੰਟ-ਐਂਡ ਦੀ ਵੈੱਬਸਾਈਟ ਵਿਕਾਸ ਨੂੰ ਅਕਸਰ 3-ਪੈਰੀ ਸਟੂਲ ਵਜੋਂ ਦਰਸਾਇਆ ਜਾਂਦਾ ਹੈ. ਹੇਠ ਦਿੱਤੇ ਇਹ ਲਤ ਹਨ:

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

  1. ਇਨਲਾਈਨ ਸਟਾਈਲ
  2. ਏਮਬੇਡ ਸਟਾਈਲ
  3. ਬਾਹਰੀ ਸਟਾਈਲ

ਇਹਨਾਂ ਹਰ ਕਿਸਮ ਦੀਆਂ CSS ਸਟਾਈਲਾਂ ਦੇ ਲਾਭ ਅਤੇ ਨੁਕਸਾਨ ਹੁੰਦੇ ਹਨ, ਇਸ ਲਈ ਆਉ ਉਹਨਾਂ 'ਤੇ ਹਰ ਇਕ' ਤੇ ਡੂੰਘੇ ਵਿਚਾਰ ਕਰੀਏ.

ਇਨਲਾਈਨ ਸਟਾਈਲ

ਇਨਲਾਈਨ ਸਟਾਈਲ ਸਟਾਈਲ ਹਨ ਜੋ ਸਿੱਧਾ HTML ਦਸਤਾਵੇਜ਼ ਵਿੱਚ ਟੈਗ ਵਿੱਚ ਲਿਖੀਆਂ ਜਾਂਦੀਆਂ ਹਨ. ਇਨਲਾਈਨ ਸਟਾਈਲ ਸਿਰਫ਼ ਉਸ ਖਾਸ ਟੈਗ ਨੂੰ ਪ੍ਰਭਾਵਿਤ ਕਰਦੇ ਹਨ ਜਿਸ ਉੱਤੇ ਉਹ ਲਾਗੂ ਹੁੰਦੇ ਹਨ. ਇੱਥੇ ਇੱਕ ਸਟੈਂਡਰਡ ਲਿੰਕ, ਜਾਂ ਐਂਕਰ ਤੇ ਲਾਗੂ ਕੀਤੇ ਇਨਲਾਈਨ ਸਟਾਈਲ ਦੀ ਇੱਕ ਉਦਾਹਰਨ ਹੈ, ਟੈਗ:

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

ਇਨਲਾਈਨ ਸਟਾਈਲ ਦੀ ਵੀ ਬਹੁਤ ਉੱਚ ਵਿਸ਼ਿਸ਼ਟਤਾ ਹੁੰਦੀ ਹੈ.

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

ਅਖੀਰ ਵਿੱਚ, ਇਨਲਾਈਨ ਸਟਾਈਲ ਸੱਚਮੁੱਚ ਹੀ ਢੁਕਵੇਂ ਹੁੰਦੇ ਹਨ ਜਦੋਂ ਬਹੁਤ ਘੱਟ ਵਰਤਦੇ ਹਨ

ਵਾਸਤਵ ਵਿੱਚ, ਮੈਂ ਕਦੇ ਵੀ ਕਦੇ ਹੀ ਆਪਣੇ ਵੈਬਪੇਜ਼ਾਂ ਤੇ ਇਨਲਾਈਨ ਸਟਾਈਲ ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਹਾਂ.

ਏਮਬੇਡ ਸਟਾਇਲ

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

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

ਸਟਾਈਲਸ਼ੀਟਾਂ ਜੋ ਕਿ ਇਸ ਵਿੱਚ ਸ਼ਾਮਿਲ ਕੀਤੀਆਂ ਗਈਆਂ ਹਨ

ਇਕ ਦਸਤਾਵੇਜ਼ ਦੇ ਉਸ ਪੰਨੇ 'ਤੇ ਇਕ ਮਾਰਕਅੱਪ ਕੋਡ ਦੀ ਮਹੱਤਵਪੂਰਣ ਮਾਤਰਾ ਵੀ ਸ਼ਾਮਲ ਕਰਦੀ ਹੈ, ਜੋ ਕਿ ਭਵਿੱਖ ਵਿੱਚ ਪੰਨੇ ਨੂੰ ਔਖਾ ਬਣਾਉਣ ਲਈ ਵੀ ਕਰ ਸਕਦੀ ਹੈ.

ਇੰਬੈੱਡ ਸਟਾਈਲ ਸ਼ੀਟਾਂ ਦਾ ਫਾਇਦਾ ਇਹ ਹੈ ਕਿ ਪੰਨੇ ਨੂੰ ਤੁਰੰਤ ਲੋਡ ਨਾਲ, ਹੋਰ ਬਾਹਰੀ ਫਾਇਲਾਂ ਨੂੰ ਲੋਡ ਕਰਨ ਦੀ ਬਜਾਏ ਲੋਡ ਕਰਨਾ. ਇਹ ਡਾਊਨਲੋਡ ਦੀ ਗਤੀ ਅਤੇ ਪ੍ਰਦਰਸ਼ਨ ਦੇ ਦ੍ਰਿਸ਼ਟੀਕੋਣ ਤੋਂ ਫਾਇਦਾ ਹੋ ਸਕਦਾ ਹੈ .

ਬਾਹਰੀ ਸਟਾਈਲ ਸ਼ੀਟਸ

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

ਇਹ ਲੰਬੇ ਸਮੇਂ ਦੇ ਸਾਈਟ ਪ੍ਰਬੰਧਨ ਨੂੰ ਬਹੁਤ ਸੌਖਾ ਬਣਾਉਂਦਾ ਹੈ

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

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

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