سی ایس ایس کلاس انتخاب گر توضیح

کلاس سلیکٹر علامت‌های دکومنٹ سے مستقل طور پر نمائش کا سلسلہ مقرر کرنا بھی ممکن ہے.

سی ایس ایس کلاس انتخاب گر

کلاس سلیکٹر علامت‌های دکومنٹ سے مستقل طور پر نمائش کا سلسلہ مقرر کرنا بھی ممکن ہے.

اس سلیکٹر کو علیحدہ از علیحدہ استعمال کیا جاسکتا ہے، یا دیگر علامت‌های ساتھ بندھا جاسکتا ہے.

تذکرہ:علامت‌های دکومنٹ کو مناسب طور پر علامت‌بندی کئے جانے کے بعد صرف ان سلیکٹروں کو استعمال کیا جاسکتا ہے، لہذا ان دونوالی سلیکٹروں کو استعمال کی جانے کے لئے ابتدائی طور پر کچھ تصورات اور منصوبہ بندی کرنا چاہئے.

نمائش کا سلسلہ استعمال کریں تاکہ کسی بھی بخصوص علامت‌های ڈیزائن کی نگرانی کی جائے، کلاس سلیکٹر استعمال کی جانے والی سب سے عام طریقہ.

کد HTML ترمیم کریں

کلاس سلیکٹر کا استعمال قبل از ترمیم مخصوص علامت‌های دکومنٹ، کلاس سلیکٹر کا استعمال کیا جاسکتا ہے.

کلاس سلیکٹر کی نمائش کا سلسلہ علامت‌ها کے ساتھ جوڑنا چاہئے، کلاس کو ایک مناسب قیمت مقرر کرنا چاہئے. لطفاً کے پائیدان نیچل کد HTML دیکھیئے:

<h1 class="important">
یہ عنوان بہت اہم ہے.
</h1>
<p class="important">
یہ پاراگراف بہت اہم ہے.
</p>

مقابل کد بالا، کلاس دونوالی علامت‌های important: عنوان اولین (عنصر h1)، پاراگراف دوم (عنصر p).

گرامر

تاہم، وہ عناصر کو جوڑتا ہے جو کی کلاس کا مرتبہ important کا حامل کا رکھتا ہے، اور وگیل سلیکشنر کا استعمال کرسکتا ہیں، جو اس طرح کیا جاسکتا ہے، یعنی کلاس کے نام کے ساتھ ایک نک کا استعمال کرسکتا ہیں:

*.important {color:red;}

اگر آپ صرف کسی کی کلاس کا نام کا حامل تمام عناصر کو منتخب کرنا چاہتے ہیں، تو کلاس سلیکشنر میں وگیل سلیکشنر کو نظر انداز کرسکتا ہیں، جس کا کوئی بدلنا نہیں آتا:

.important {color:red;}

خود خود سائیں سائیں کوشش کریں

عناصر سلیکشنر کے ساتھ کیا جاسکتا ہے

کلاس سلیکشنر کو عناصر سلیکشنر کے ساتھ استعمال کیا جاسکتا ہے。

مثلاً آپ ممکن ہو کہ صرف پاراگراف کو قرمز فون میں دکھانے چاہتے ہیں:

p.important {color:red;}

اس سلیکشنر نے اب کلاس کا مرتبہ important کا حامل تمام پاراگراف عناصر کو جوڑ دیا ہے، لیکن دوسرے کوئی عنصر کو جوڑ نہیں دیا، چاہے وہ کسی بھی قسم کا کیا ہو، کلاس کا مرتبہ یا نہ کا مرتبہ رکھتا ہو، سلیکشنر p.important کا مطلب یہ ہوتا ہے: 'کلاس کا مرتبہ important کا حامل تمام پاراگراف عناصر'، کیونکہ h1 عنصر پاراگراف نہیں ہے، اس کا سلیکشنر اس رول سے نہیں جڑتا، اس لئے h1 عنصر کو نہیں قرمز فون میں تبدیل کیا جاتا

اگر آپ واقعی طور پر h1 عنصر کا مختلف سائز دینا چاہتے ہیں، تو سلیکشنر h1.important استعمال کرسکتا ہیں:

p.important {color:red;}
h1.important {color:blue;}

خود خود سائیں سائیں کوشش کریں

CSS کی متعدد کلاس سلیکشنر

پچھلے سیکشن میں، ہم نے کلاس کا مرتبہ ایک کلمے کا حامل کا معاملہ ہلکا کردیا تھا۔ HTML میں، کلاس کا مرتبہ کلموں کا ایک فہرست کا حامل کا معاملہ ممکن ہوتا ہے، جس میں کلمات سے خالی جگہ کا استعمال کیا جاتا ہے۔ مثلاً اگر آپ کا مقصد یہ ہے کہ ایک مخصوص عنصر کو دونوں کی طرح علامت دینا چاہتے ہیں، کلاس کا مرتبہ اہم اور وارننگ، تو اس طرح لکھ سکتا ہو:

<p class="important warning">
This paragraph is a very important warning.
</p>

دونوں کی ترتیب کوئی اہمیت نہیں رکھتی، ویسا بھی لکھ سکتا ہو

آج میں وضاحت دینا چاہتا ہوں کہ کلاس کا نام important کا رکھنے والی تمام عناصر تیرا کیا ہوتا ہے، کلاس کا نام warning کا رکھنے والی تمام عناصر کا کیا ہوتا ہے اور کلاس میں دونوں کا نام رکھنے والی تمام عناصر کا کیا ہوتا ہے، ایک سورین پس منظر کا رکھتا ہے، جو اس طرح کیا جاسکتا ہے:

.important {font-weight:bold;}
.warning {font-style:italic;}
.important.warning {background:silver;}

خود خود سائیں سائیں کوشش کریں

دو کلاس سلیکشنر زرین کے ساتھ جوڑ کر، صرف کیا جاسکتا ہےیہ کلاس شامل کرسکتا ہےعناصر (کلاس کی ترتیب نہیں کی جاتی)

اگر کسی کثیر کلاس انتخاب گر میں کلاس ناموں کی فہرست میں نہ کسی کلاس کا نام شامل ہو، متلازمی میں شکست آئیگی۔ لطفاً درج ذیل اصول دیکھیئے:

.important.urgent {background:silver;}

مطمئناً اس انتخاب گر نے صرف کلاس نمائش میں اہم اور فوری لفظ شامل پ اے عناصر کو متلازم کیا ہے۔ لہذا اگر کسی پ عناصر کی کلاس نمائش میں صرف اہم اور وارننگ لفظ شامل ہو، متلازم نہیں ہوگا۔ لیکن یہ دراصل درج ذیل عناصر کو متلازم کرسکتا ہے:

<p کلاس="important urgent warning">
یہ پیراگراف بہت اہم اور فوری انتباہ ہے.
</p>

خود خود سائیں سائیں کوشش کریں

مہم کی اہمیت:آئی ای ای سات سے پہلے کی نسلیں میں، مختلف پلیٹ فارموں کے انٹرنیٹ ایکسپلورر مختلف کلاس کا انتخاب گر سے صحیح طور پر نہیں کا م کرسکتا۔