ਬਾਹਰੀ CSS ਪਰਿਭਾਸ਼ਾ ਅਤੇ ਇੱਕ ਨਾਲ ਕਿਵੇਂ ਲਿੰਕ ਕਰੋ
ਜਦੋਂ ਇੱਕ ਵੈਬ ਬ੍ਰਾਉਜ਼ਰ ਇੱਕ ਵੈਬ ਪੇਜ ਨੂੰ ਲੋਡ ਕਰਦਾ ਹੈ, ਜਿਸ ਤਰ੍ਹਾਂ ਦਿਖਾਈ ਦਿੰਦਾ ਹੈ ਉਹ ਕੈਸਕੇਡਿੰਗ ਸ਼ੈਲੀ ਸ਼ੀਟ ਤੋਂ ਜਾਣਕਾਰੀ ਦੁਆਰਾ ਨਿਰਧਾਰਤ ਕੀਤਾ ਜਾਂਦਾ ਹੈ. ਇੱਕ ਸਟਾਈਲ ਸ਼ੀਟ ਨੂੰ ਵਰਤਣ ਲਈ ਇੱਕ HTML ਫਾਈਲ ਦੇ ਤਿੰਨ ਤਰੀਕੇ ਹਨ: ਬਾਹਰੋਂ, ਅੰਦਰੂਨੀ ਅਤੇ ਇਨ-ਲਾਈਨ
ਅੰਦਰੂਨੀ ਅਤੇ ਇਨ-ਲਾਈਨ ਸਟਾਈਲ ਸ਼ੀਟਾਂ ਨੂੰ HTML ਫਾਈਲ ਵਿੱਚ ਹੀ ਸਟੋਰ ਕੀਤਾ ਜਾਂਦਾ ਹੈ. ਉਹ ਇਸ ਪਲ ਨਾਲ ਕੰਮ ਕਰਨਾ ਆਸਾਨ ਹੋ ਜਾਂਦੇ ਹਨ, ਪਰ ਕਿਉਂਕਿ ਉਹ ਕਿਸੇ ਕੇਂਦਰੀ ਸਥਾਨ ਵਿੱਚ ਨਹੀਂ ਸਟੋਰ ਕੀਤੇ ਜਾਂਦੇ ਹਨ, ਇੱਕ ਵਾਰ ਵਿੱਚ ਪੂਰੀ ਵੈਬਸਾਈਟ ਤੇ ਸਟਾਈਲ ਵਿੱਚ ਅਸਾਨੀ ਨਾਲ ਤਬਦੀਲ ਕਰਨਾ ਅਸੰਭਵ ਹੈ; ਤੁਹਾਨੂੰ ਇਸ ਦੀ ਬਜਾਏ ਹਰ ਐਂਟਰੀ ਵਿੱਚ ਵਾਪਸ ਜਾਣਾ ਚਾਹੀਦਾ ਹੈ ਅਤੇ ਇਸਨੂੰ ਖੁਦ ਖੁਦ ਬਦਲਣਾ ਹੋਵੇਗਾ.
ਹਾਲਾਂਕਿ, ਇੱਕ ਬਾਹਰੀ ਸ਼ੈਲੀ ਸ਼ੀਟ ਨਾਲ, ਪੰਨੇ ਨੂੰ ਪੇਸ਼ ਕਰਨ ਲਈ ਨਿਰਦੇਸ਼ ਇੱਕ ਫਾਈਲ ਵਿੱਚ ਸਟੋਰ ਕੀਤੇ ਜਾਂਦੇ ਹਨ, ਜੋ ਇੱਕ ਪੂਰੀ ਵੈਬਸਾਈਟ ਜਾਂ ਮਲਟੀਪਲ ਐਲੀਮੈਂਟਸ ਵਿੱਚ ਸਟਾਈਲ ਨੂੰ ਸੰਪਾਦਿਤ ਕਰਨਾ ਸੌਖਾ ਬਣਾਉਂਦਾ ਹੈ. ਫਾਇਲ .ਸੀ.ਐਸ.ਐੱਸ ਫਾਇਲ ਐਕਸਟੈਂਸ਼ਨ ਦੀ ਵਰਤੋਂ ਕਰਦੀ ਹੈ, ਅਤੇ ਉਸ ਫਾਈਲ ਦੀ ਸਥਿਤੀ ਦੇ ਲਿੰਕ ਨੂੰ HTML ਦਸਤਾਵੇਜ਼ ਵਿੱਚ ਸ਼ਾਮਲ ਕੀਤਾ ਗਿਆ ਹੈ ਤਾਂ ਕਿ ਵੈੱਬ ਬ੍ਰਾਊਜ਼ਰ ਜਾਣਦਾ ਹੋਵੇ ਕਿ ਸਟਾਈਲ ਨਿਰਦੇਸ਼ਾਂ ਦੀ ਕਿੱਥੇ ਖੋਜ ਕਰਨੀ ਹੈ.
ਇੱਕ ਜਾਂ ਇੱਕ ਤੋਂ ਵੱਧ ਦਸਤਾਵੇਜ਼ ਇਕੋ ਜਿਹੇ CSS ਫਾਈਲ ਨਾਲ ਲਿੰਕ ਕਰ ਸਕਦੇ ਹਨ, ਅਤੇ ਇੱਕ ਵੈਬਸਾਈਟ ਵਿੱਚ ਵੱਖਰੇ ਪੰਨਿਆਂ, ਸਾਰਣੀਆਂ, ਚਿੱਤਰਾਂ ਆਦਿ ਨੂੰ ਸਟਾਇਲ ਕਰਨ ਲਈ ਕਈ ਵਿਲੱਖਣ CSS ਫਾਈਲਾਂ ਹੋ ਸਕਦੀਆਂ ਹਨ.
ਇੱਕ ਬਾਹਰੀ ਸਟਾਈਲ ਸ਼ੀਟ ਨਾਲ ਕਿਵੇਂ ਲਿੰਕ ਕਰੋ
ਹਰੇਕ ਵੈਬ ਪੇਜ, ਜੋ ਕਿਸੇ ਵਿਸ਼ੇਸ਼ ਬਾਹਰੀ ਸ਼ੈਲੀ ਸ਼ੀਟ ਨੂੰ ਵਰਤਣਾ ਚਾਹੁੰਦਾ ਹੈ, ਨੂੰ ਸੈਕਸ਼ਨ ਦੇ ਅੰਦਰੋਂ CSS ਫਾਈਲ ਨਾਲ ਜੋੜਨ ਦੀ ਜ਼ਰੂਰਤ ਹੈ, ਬਹੁਤ ਕੁਝ ਇਸ ਤਰਾਂ:
head>ਇਸ ਉਦਾਹਰਨ ਵਿੱਚ, ਇਸ ਨੂੰ ਆਪਣੇ ਦਸਤਾਵੇਜ਼ ਤੇ ਲਾਗੂ ਕਰਨ ਲਈ ਲੋੜੀਂਦੀ ਇਕੋਚੀ ਸਿਰਫ ਸਟਾਈਲਜ CSS ਹੈ. ਇਹ ਤੁਹਾਡੇ CSS ਫਾਈਲ ਦਾ ਸਥਾਨ ਹੈ.
ਜੇ ਫਾਇਲ ਨੂੰ ਅਸਲ ਵਿੱਚ styles.css ਕਿਹਾ ਜਾਂਦਾ ਹੈ ਅਤੇ ਉਹ ਉਸੇ ਫੋਲਡਰ ਵਿੱਚ ਉਸੇ ਡੌਕਯੁਮੈੱਨਟ ਵਿੱਚ ਸਥਿਤ ਹੁੰਦਾ ਹੈ ਜੋ ਇਸ ਨਾਲ ਲਿੰਕ ਹੈ, ਤਾਂ ਇਹ ਬਿਲਕੁਲ ਉਸੇ ਤਰ੍ਹਾਂ ਰਹਿ ਸਕਦਾ ਹੈ ਜਿਵੇਂ ਇਹ ਉਪਰ ਲਿਖਿਆ ਹੋਇਆ ਹੈ ਹਾਲਾਂਕਿ, ਸੰਭਾਵਨਾ ਹਨ ਕਿ ਤੁਹਾਡੀ CSS ਫਾਈਲ ਦਾ ਸਿਰਲੇਖ ਕੁਝ ਹੋਰ ਹੈ, ਜਿਸ ਵਿੱਚ ਤੁਸੀਂ ਬਸ "ਸਟਾਇਲ" ਤੋਂ ਨਾਂ ਜੋ ਵੀ ਤੁਹਾਡੀ ਥਾਂ ਵਿੱਚ ਬਦਲ ਸਕਦੇ ਹੋ.
ਜੇ CSS ਫਾਈਲ ਇਸ ਫੋਲਡਰ ਦੇ ਰੂਟ ਤੇ ਨਹੀਂ ਹੈ ਬਲਕਿ ਸਬਫੋਲਡਰ ਵਿੱਚ ਹੈ, ਤਾਂ ਇਹ ਇਸ ਦੀ ਬਜਾਏ ਇਸ ਦੀ ਕੋਈ ਚੀਜ਼ ਪੜ੍ਹ ਸਕਦੀ ਹੈ:
head>ਬਾਹਰੀ CSS ਫਾਇਲਾਂ ਬਾਰੇ ਵਧੇਰੇ ਜਾਣਕਾਰੀ
ਬਾਹਰੀ ਸਟਾਈਲ ਸ਼ੀਟਾਂ ਦਾ ਸਭ ਤੋਂ ਵੱਡਾ ਫਾਇਦਾ ਇਹ ਹੈ ਕਿ ਉਹ ਕਿਸੇ ਖਾਸ ਸਫ਼ੇ ਨਾਲ ਨਹੀਂ ਜੁੜੇ ਹੁੰਦੇ ਹਨ. ਜੇਕਰ ਸਟਾਇਲ ਅੰਦਰੂਨੀ ਜਾਂ ਇਨ-ਲਾਈਨ ਕੀਤੀ ਜਾਂਦੀ ਹੈ, ਤਾਂ ਵੈਬਸਾਈਟ ਤੇ ਦੂਜੇ ਪੰਨੇ ਉਹਨਾਂ ਸਟਾਈਲ ਪ੍ਰੈੰਕਸ਼ਨਾਂ ਵੱਲ ਇਸ਼ਾਰਾ ਨਹੀਂ ਕਰ ਸਕਦੇ.
ਬਾਹਰੀ ਸਟੀਲਿੰਗ ਨਾਲ, ਹਾਲਾਂਕਿ, ਉਸੇ CSS ਫਾਈਲ ਨੂੰ ਵੈਬਸਾਈਟ ਤੇ ਹਰ ਇੱਕ ਸਫ਼ੇ ਲਈ ਵਰਤੀ ਜਾ ਸਕਦੀ ਹੈ ਤਾਂ ਕਿ ਉਹਨਾਂ ਦੇ ਸਾਰੇ ਕੋਲ ਇਕੋ ਜਿਹਾ ਦਿੱਖ ਹੋਵੇ ਅਤੇ ਸਾਰੀ ਵੈਬਸਾਈਟ ਦੀ CSS ਸਮੱਗਰੀ ਨੂੰ ਸੰਪਾਦਿਤ ਕਰਨਾ ਬਹੁਤ ਅਸਾਨ ਅਤੇ ਕੇਂਦਰੀਕਰਣ ਹੈ.
ਤੁਸੀਂ ਦੇਖ ਸਕਦੇ ਹੋ ਕਿ ਇਹ ਕਿਵੇਂ ਕੰਮ ਕਰਦਾ ਹੈ ...
ਅੰਦਰੂਨੀ ਸਟਾਇਲਿੰਗ ਨੂੰ ਟੈਗਾਂ ਦੀ ਵਰਤੋਂ ਕਰਨ ਦੀ ਜ਼ਰੂਰਤ ਹੁੰਦੀ ਹੈ, ਕਿਉਂਕਿ ਉਹਨਾਂ ਨੂੰ ਟੈਗ ਤੋਂ ਵੱਖ ਰੱਖਣਾ ਚਾਹੀਦਾ ਹੈ:
ਸਰੀਰ {ਪਿੱਠਭੂਮੀ ਦਾ ਰੰਗ: ਹਰੀ; } h1 {color: ਨੀਲਾ; ਹਾਸ਼ੀਆ-ਖੱਬਾ: 15px; } style> head>ਹਾਲਾਂਕਿ, ਕਿਉਂਕਿ ਬਾਹਰੀ ਸਟਾਈਲ ਸ਼ੀਟਾਂ ਆਪਣੀ ਖੁਦ ਦੀ ਫਾਈਲ ਵਿੱਚ ਸ਼ਾਮਲ ਹੁੰਦੀਆਂ ਹਨ, ਉਹਨਾਂ ਨੂੰ ਇਸ ਤਰ੍ਹਾਂ ਬਣਾਇਆ ਜਾ ਸਕਦਾ ਹੈ, ਅਤੇ ਇਸਦਾ ਉੱਪਰਲੀ ਨਮੂਨੇ ਦੇ ਤੌਰ ਤੇ ਉਸੇ ਹੀ ਚੀਜ਼ ਦਾ ਮਤਲਬ ਹੈ:
ਸਰੀਰ {ਪਿੱਠਭੂਮੀ ਰੰਗ: ਹਰੀ; } h1 {color: ਨੀਲਾ; ਹਾਸ਼ੀਆ-ਖੱਬਾ: 15px; }ਇਹਨਾਂ ਉਦਾਹਰਣਾਂ ਵਿੱਚ, ਇਨਲਾਈਨ ਸਿਲਾਈ ਸਿਰਫ ਉਸ ਖਾਸ ਪੰਨੇ 'ਤੇ ਲਾਗੂ ਹੁੰਦੀ ਹੈ, ਇਸ ਤੱਥ ਤੋਂ ਸਪੱਸ਼ਟ ਹੁੰਦਾ ਹੈ ਕਿ ਇਹ HTML ਸਫ਼ੇ ਦੇ ਹੈਡਰ ਵੇਰਵੇ ਵਿੱਚ ਸ਼ਾਮਲ ਹੈ. ਦੂਜੀ ਉਦਾਹਰਨ ਦੇ ਨਾਲ, CSS ਜਾਣਕਾਰੀ ਇੱਕ CSS ਫਾਈਲ ਵਿੱਚ ਸਵੈ-ਸੰਬੱਧ ਹੈ, ਜੋ ਕਿ ਕਿਸੇ ਵੀ ਪੰਨੇ ਉਪਰੋਕਤ ਇੱਕ ਵਿਸਤ੍ਰਿਤ ਸਟਾਈਲ ਸ਼ੀਟ ਭਾਗ ਨਾਲ ਕਿਸ ਤਰ੍ਹਾਂ ਲਿੰਕ ਕਰਨ ਲਈ ਕੋਡ ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹਨ.