سی ای اس id انتخاب گر توضیح داده شده

ID 选择器允许以一种独立于文档元素的方式来指定样式。

CSS ID 选择器

在某些方面,ID 选择器类似于类选择器,不过也有一些重要差别。

语法

首先,ID 选择器前面有一个 # 号 - 也称为棋盘号或井号。

请看下面的规则:

*#intro {font-weight:bold;}

与类选择器一样,ID 选择器中可以忽略通配选择器。前面的例子也可以写作:

#intro {font-weight:bold;}

ਇਸ ਚੋਣਕਰਤਾ ਦਾ ਪ੍ਰਭਾਵ ਇੱਕ ਹੀ ਹੋਵੇਗਾ。

ਦੂਜੀ ਅਤੇਰੀ ਹੈ ਕਿ ਆਈਡੀ ਚੋਣਕਰਤਾ ਕਲਾਸ ਪ੍ਰਤੀਯੋਗਿਤਾ ਦੇ ਮੁੱਲ ਨਹੀਂ ਦਿੰਦਾ, ਬਲਕਿ ਨਿਸ਼ਚਿਤ ਤੌਰ 'ਤੇ ਆਈਡੀ ਪ੍ਰਤੀਯੋਗਿਤਾ ਦੇ ਮੁੱਲ ਨੂੰ ਦਿੰਦਾ ਹੈ。

ਹੇਠ ਇੱਕ ਵਾਸਤਵਿਕ ਆਈਡੀ ਚੋਣਕਰਤਾ ਦਾ ਉਦਾਹਰਣ ਹੈ:

<p id="intro"این ایک معرفیاتی پاراگراف ہے。</p>

ਆਪਣੇ ਅਨੁਭਵ ਕਰੋ

ਵਰਗ ਚੋਣਕਰਤਾ ਹੈ ਜਾਂ ਆਈਡੀ ਚੋਣਕਰਤਾ?

ਵਰਗ ਚੋਣਕਰਤਾ ਦੇ ਇਸ ਚਾਪ 'ਚ ਅਸੀਂ ਸਮਝਾਇਆ ਹੈ ਕਿ ਕਿਸੇ ਵੀ ਸਖ਼ਮ ਇਲਾਕੇ ਨੂੰ ਕਿਸੇ ਅਣਗਿਣਤ ਸਖ਼ਮ ਇਲਾਕਿਆਂ 'ਤੇ ਲਾਗੂ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ। ਪਿਛਲੇ ਚਾਪ 'ਚ ਵਰਗ ਨਾਮ important ਨੂੰ p ਅਤੇ h1 ਇਲਾਕਿਆਂ 'ਤੇ ਲਾਗੂ ਕੀਤਾ ਗਿਆ ਸੀ ਅਤੇ ਇਹ ਹੋਰ ਇਲਾਕਿਆਂ 'ਤੇ ਵੀ ਲਾਗੂ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ。

ਅਤੇਰੀ 1: ਦਸਤਾਵੇਜ਼ ਵਿੱਚ ਇੱਕ ਵਾਰ ਹੀ ਵਰਤੀ ਜਾ ਸਕਦੀ ਹੈ

ਵਰਗ ਤੋਂ ਅਲੱਗ, ਇੱਕ ਹੀ ਹੈਲਾਈਟ ਦਸਤਾਵੇਜ਼ ਵਿੱਚ ਆਈਡੀ ਚੋਣਕਰਤਾ ਇੱਕ ਵਾਰ ਵਰਤੀ ਜਾਵੇਗੀ ਅਤੇ ਸਿਰਫ ਇੱਕ ਵਾਰ ਹੀ।

ਅਤੇਰੀ 2: ਆਈਡੀ ਸ਼ਬਦਾਂ ਦੀ ਸੂਚੀ ਨਹੀਂ ਵਰਤੀ ਜਾ ਸਕਦੀ

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

ਅਤੇਰੀ 3: ਆਈਡੀ ਵਿੱਚ ਅਧਿਕ ਮਹੱਤਵ ਹੋ ਸਕਦਾ ਹੈ

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

#mostImportant {color:red; background:yellow;}

ਇਹ ਨਿਯਮ ਨਿਮਨਲਿਖਤ ਇਲਾਕਿਆਂ ਨਾਲ ਮੇਲ ਖਾਵੇਗਾ (ਇਹ ਇਲਾਕੇ ਇੱਕ ਹੀ ਦਸਤਾਵੇਜ਼ ਵਿੱਚ ਨਹੀਂ ਸਕਦੇ ਕਿਉਂਕਿ ਉਹਨਾਂ ਦੇ ਆਈਡੀ ਮੁੱਲ ਇੱਕ ਹੀ ਹਨ):

<h1 id="mostImportant"ਇਹ ਮਹੱਤਵਪੂਰਨ ਹੈ!
<em id="mostImportant"ਇਹ ਮਹੱਤਵਪੂਰਨ ਹੈ!
<ul id="mostImportant"این ایک اہمیت کا پاراگراف ہے!</ul>

عیناً امتحان کریئے:

اگر اور فرق

توجہ دیئے، کلاس انتخاب گر اور id انتخاب گر ممکن ہیں کہ وہ اور اور فرق کرسکیں۔ یہ واقعت دستاویز کی زبان پر منحصر ہوتا ہے۔ ایچ تی ایم ال اور ایکس ایچ تی ایم ال کلاس اور id کی وار دیئے گئی جگہوں کو اور اور فرق کرسکتا ہے، لہذا کلاس اور id کی وار کی بولڈ اور چھوٹی اور بولڈ اور چھوٹی کی جگہوں کو نہیں چن سکتا۔

اس لئے، دراصل اس سی ای اس اور ایچ تی ام ال کے لئے عناصر کا فونت بولڈ نہیں بنائی جائیگا:

#intro {font-weight:bold;}
<p id="Intro"این ایک معرفیاتی پاراگراف ہے。</p>

اگر حرف ای کا اور حرف آئی کا بڑا اور چھوٹا فرق ہوتا ہے تو انتخاب گر اس عناصر کو نہیں میچ کرسکتا۔