CSS ਚੋਣਕਾਰ ਕਲਾਸ ਅਤੇ ਆਈਡੀ ਵਿੱਚ ਕੀ ਅੰਤਰ ਹੈ? HTML ਵਿੱਚ id ਅਤੇ ਕਲਾਸ ਦੀ ਵਰਤੋਂ

CSS ਚੋਣਕਾਰ ਕਲਾਸ ਅਤੇ ਆਈਡੀ ਵਿੱਚ ਕੀ ਅੰਤਰ ਹੈ? HTML ਵਿੱਚ id ਅਤੇ ਕਲਾਸ ਦੀ ਵਰਤੋਂ

ਚੇਨ ਵੇਲਿਯਾਂਗਵਰਤਮਾਨ ਵਿੱਚ ਚਲਾਇਆ ਜਾ ਰਿਹਾ ਹੈSEO, ਸਾਈਟ ਨੂੰ ਅਨੁਕੂਲ ਬਣਾਓਵਰਡਪਰੈਸਥੀਮ

ਹਾਲਾਂਕਿ ਮੈਂ ਪਹਿਲਾਂ ਕੁਝ ਬੁਨਿਆਦੀ HTML ਅਤੇ CSS ਗਿਆਨ ਸਿੱਖਿਆ ਹੈ, ਪਰ ਮੈਂ ਇਸਨੂੰ ਕੁਝ ਸਮੇਂ ਲਈ ਨਹੀਂ ਚਲਾਇਆ ਹੈ, ਖਾਸ ਤੌਰ 'ਤੇ CSS ਭਾਗ ਦੀ ਵਰਤੋਂ, ਭੁੱਲਣਾ ਆਸਾਨ ਹੈ.

ਇਸ ਲਈ, CSS ਚੋਣਕਾਰ ਆਈਡੀ ਅਤੇ ਕਲਾਸ ਦੇ ਅੰਤਰ ਅਤੇ ਵਰਤੋਂ ਨੂੰ ਇੱਥੇ ਰਿਕਾਰਡ ਕਰੋ ਅਤੇ ਸੰਖੇਪ ਕਰੋ:

  • id #div ਨਾਲ ਮੇਲ ਖਾਂਦਾ ਹੈ
  • ਕਲਾਸ .div ਨਾਲ ਮੇਲ ਖਾਂਦੀ ਹੈ

ਆਈਡੀ ਅਤੇ ਕਲਾਸ ਵਿੱਚ ਅੰਤਰ

ਆਈਡੀ ਦਾ ਵੇਰਵਾ

  • id ਇੱਕ ਫਿਕਸਡ ਟੈਗ ਹੈ, ਜੋ ਕਿ ਵੈਬ ਪੇਜ ਵਿੱਚ ਵੱਡੀ ਸ਼ੈਲੀ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਨ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ, ਜਿਸ ਨੂੰ #div ਦੇ ਰੂਪ ਵਿੱਚ ਪਰਿਭਾਸ਼ਿਤ ਕੀਤਾ ਗਿਆ ਹੈ
  • ਉਦਾਹਰਨ ਲਈ: ਕਾਲਮ, ਸਿਖਰ, ਸਰੀਰ, ਹੇਠਾਂ, ਆਦਿ ਨੂੰ ਵੰਡਣਾ...
  • ਇੱਕ ਖਾਸ ਤੱਤ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਨ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ, ਜੋ ਪ੍ਰਤੀ ਪੰਨੇ ਵਿੱਚ ਸਿਰਫ਼ ਇੱਕ ਵਾਰ ਦਿਖਾਈ ਦੇ ਸਕਦਾ ਹੈ ਅਤੇ ਵਾਰ-ਵਾਰ ਕਾਲ ਨਹੀਂ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ।

ਕਲਾਸ ਦਾ ਵੇਰਵਾ

  • ਕਲਾਸ ਇੱਕ ਸ਼ੈਲੀ ਸਮੂਹ ਹੈ, ਜਿਸਦੀ ਵਰਤੋਂ ਵੈਬ ਪੇਜ ਵਿੱਚ ਵਿਸਤ੍ਰਿਤ ਸ਼ੈਲੀਆਂ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਨ ਲਈ ਕੀਤੀ ਜਾਂਦੀ ਹੈ। ਇਸਨੂੰ .div ਦੇ ਰੂਪ ਵਿੱਚ ਪਰਿਭਾਸ਼ਿਤ ਕੀਤਾ ਜਾਂਦਾ ਹੈ ਅਤੇ ਇਸਨੂੰ ਦੁਹਰਾਇਆ ਜਾ ਸਕਦਾ ਹੈ।
  • ਉਦਾਹਰਨ ਲਈ: ਇੱਕ ਖਾਸ ਮੀਨੂ, ਟੈਕਸਟ ਦੀ ਇੱਕ ਲਾਈਨ, ਆਦਿ...
  • ਉਸੇ ਪੰਨੇ 'ਤੇ, ਇਸ ਨੂੰ ਕਈ ਤੱਤਾਂ ਦੁਆਰਾ ਵਾਰ-ਵਾਰ ਬੁਲਾਇਆ ਜਾ ਸਕਦਾ ਹੈ

div ਚੋਣਕਾਰ ਦੀ ਆਪਣੇ ਆਪ ਵਿੱਚ ਕੋਈ ਵਿਸ਼ੇਸ਼ਤਾ ਨਹੀਂ ਹੈ। ਇਸਦੇ css ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਕੇ, ਇਹ ਕੁਝ ਲੇਆਉਟਸ ਨੂੰ ਨਿਯੰਤਰਿਤ ਕਰਦਾ ਹੈ ਜਿਵੇਂ ਕਿ div ਦੀ ਚੌੜਾਈ, ਉਚਾਈ, ਪਿਛੋਕੜ ਦਾ ਰੰਗ ਅਤੇ ਟੈਕਸਟ ਦਾ ਆਕਾਰ।

ਜਨਰਲਈ-ਕਾਮਰਸਵੈੱਬਸਾਈਟ,ਇੱਕ ਵੈਬਸਾਈਟ ਬਣਾਓਪ੍ਰੋਗਰਾਮ ਦੁਆਰਾ ਤਿਆਰ ਕੀਤਾ ਗਿਆ html ਵੈੱਬ ਪੇਜ CSS ਦੁਆਰਾ ਪੇਜ ਲੇਆਉਟ ਨੂੰ ਮਹਿਸੂਸ ਕਰਨਾ ਹੈ.

ਇੱਕ ਚੋਣਕਾਰ ਕੀ ਹੈ?

ਹਰੇਕ CSS ਸ਼ੈਲੀ ਦੀ ਪਰਿਭਾਸ਼ਾ ਵਿੱਚ 2 ਭਾਗ ਹੁੰਦੇ ਹਨ:

选择器 {样式}
  • {} ਤੋਂ ਪਹਿਲਾਂ ਵਾਲਾ ਹਿੱਸਾ "ਚੋਣਕਾਰ" ਹੈ।
  • "ਚੋਣਕਾਰ" {} ਦੀ "ਸ਼ੈਲੀ" ਨੂੰ ਦਰਸਾਉਂਦਾ ਹੈ ਜਿਸ ਨਾਲ ਇਹ ਕੰਮ ਕਰਦਾ ਹੈ।
  • ਭਾਵ, ਵੈਬ ਪੇਜ ਦੇ ਕਿਹੜੇ ਤੱਤ 'ਤੇ ਇਹ "ਸ਼ੈਲੀ" ਕੰਮ ਕਰਦੀ ਹੈ?

ਕੋਡ ਉਦਾਹਰਨ

ਕਲਾਸ="ਸਾਈਡਬਾਰ" ਐਲੀਮੈਂਟ ਨੂੰ ਕਿਵੇਂ ਚੁਣਨਾ ਅਤੇ ਸਟਾਈਲ ਕਰਨਾ ਹੈ ਇਹ ਇੱਥੇ ਹੈ:

.sidebar
{ 
background-color:black;
}

ਇੱਥੇ id="footer" ਨਾਲ ਕਿਸੇ ਤੱਤ ਨੂੰ ਚੁਣਨ ਅਤੇ ਸਟਾਈਲ ਕਰਨ ਦਾ ਤਰੀਕਾ ਦੱਸਿਆ ਗਿਆ ਹੈ:

#footer
{ 
background-color:black;
}

ਹੋਪ ਚੇਨ ਵੇਇਲਿਯਾਂਗ ਬਲੌਗ ( https://www.chenweiliang.com/ ) ਨੇ ਸਾਂਝਾ ਕੀਤਾ "CSS ਚੋਣਕਾਰ ਕਲਾਸ ਅਤੇ ਆਈਡੀ ਵਿੱਚ ਕੀ ਅੰਤਰ ਹੈ? HTML ਵਿੱਚ ਆਈਡੀ ਅਤੇ ਕਲਾਸ ਦੀ ਵਰਤੋਂ ਤੁਹਾਡੀ ਮਦਦ ਕਰੇਗੀ।

ਇਸ ਲੇਖ ਦਾ ਲਿੰਕ ਸਾਂਝਾ ਕਰਨ ਲਈ ਸੁਆਗਤ ਹੈ:https://www.chenweiliang.com/cwl-572.html

ਨਵੀਨਤਮ ਅਪਡੇਟਸ ਪ੍ਰਾਪਤ ਕਰਨ ਲਈ ਚੇਨ ਵੇਇਲਿਯਾਂਗ ਦੇ ਬਲੌਗ ਦੇ ਟੈਲੀਗ੍ਰਾਮ ਚੈਨਲ ਵਿੱਚ ਸੁਆਗਤ ਹੈ!

🔔 ਚੈਨਲ ਦੀ ਚੋਟੀ ਦੀ ਡਾਇਰੈਕਟਰੀ ਵਿੱਚ ਕੀਮਤੀ "ChatGPT ਸਮੱਗਰੀ ਮਾਰਕੀਟਿੰਗ AI ਟੂਲ ਵਰਤੋਂ ਗਾਈਡ" ਪ੍ਰਾਪਤ ਕਰਨ ਵਾਲੇ ਪਹਿਲੇ ਬਣੋ! 🌟
📚 ਇਸ ਗਾਈਡ ਵਿੱਚ ਬਹੁਤ ਵੱਡਾ ਮੁੱਲ ਹੈ, 🌟ਇਹ ਇੱਕ ਦੁਰਲੱਭ ਮੌਕਾ ਹੈ, ਇਸ ਨੂੰ ਨਾ ਗੁਆਓ! ⏰⌛💨
ਜੇ ਚੰਗਾ ਲੱਗੇ ਤਾਂ ਸ਼ੇਅਰ ਅਤੇ ਲਾਈਕ ਕਰੋ!
ਤੁਹਾਡੀ ਸ਼ੇਅਰਿੰਗ ਅਤੇ ਪਸੰਦ ਸਾਡੀ ਨਿਰੰਤਰ ਪ੍ਰੇਰਣਾ ਹਨ!

 

ਇੱਕ ਟਿੱਪਣੀ ਪੋਸਟ

ਤੁਹਾਡਾ ਈਮੇਲ ਪਤਾ ਪ੍ਰਕਾਸ਼ਤ ਨਹੀ ਕੀਤਾ ਜਾਵੇਗਾ. ਲੋੜੀਂਦੇ ਖੇਤਰ ਵਰਤੇ ਜਾ ਰਹੇ ਹਨ * ਲੇਬਲ

ਸਿਖਰ ਤੱਕ ਸਕ੍ਰੋਲ ਕਰੋ