CSS Selectors. selectors جي قسمن

جنهن مان هر هڪ اوھان کي هڪ مخصوص رنگ قائم ڪرڻ چاهيو ٿا،. ان کي ڪيئن ڪندا؟ معياري CSS selectors، ٽيگ لاء مناسب نه آهي ته اهي فوري طور تي سڀني جا پور لاء حراست ۾ صاف ظاهر آهي. حل سادو آهي. ڪلاس جا ميمبر مقرر. طبقاتي = 'نيري'، ٽيون - - طبقي = 'سائي' مثال طور، پهرين div طبقي = 'ڳاڙهو'، ٻيو ملي. هاڻي اهي CSS جدولن جو استعمال ٿيل ڪري سگهجي ٿو.

هن نحو ڏنل آهي: هڪ نقطي چاهي ( ".")، طبقاتي جو نالو لکڻ جي پٺيان. پهرين يونٽ کي منظم ڪرڻ، .red جي تعمير لاء استعمال. ٻيو - .blue ۽ پوء تي.

اهم! اهو طبقو وصف جي معني ته انهيء کي استعمال ڪرڻ جي صلاح ڏني آهي. اهو transliteration (مثال طور، krasiviy-blok) يا اکر / انگ (ojfh834871) جي بي ترتيبي مجموعا استعمال ڪرڻ جي خراب صورت سمجهيو ويندو آهي. هن ڪوڊ ۾، توهان کي پريشان حاصل ڪرڻ لاء، کي نه ياد سختيء ته جن کي اوھان کان پوء منصوبي ۾ مصروف ٿي ويندو منهن ڪندو پابند ھوندا آھن. بهترين اختيار - اهڙي BEM طور تي، ڪنهن به طريقو استعمال ڪرڻ.

فائدن - نسبتا بلند سکيائي.

وڌڻ - جي وڌيڪ جزا ۽ اهو ساڳيو طبقو، جنهن جو مطلب آهي ته اهي جهازن کي تبديل ڪيو ويندو ٿي سگھي ٿو. هن مسئلي جي منھجي سان گڏو گڏ preprocessors جي وارث کي استعمال حل آهي. توهان جي هٿن ۾ گهٽ، sass يا ڪجهه ٻين preprocessor حاصل ڪرڻ جي پڪ ٿي، اھي عمارت سازيء جي ڪم simplify.

سڃاڻپ selector

جي باري ۾ هن نسخي جي راء coders ۽ programmers لفظ آهن. CSS вообще не рекомендуют использовать ID, поскольку при неаккуратном применении они могут вызвать проблемы с наследованием. ڇاڪاڻ ته غلط درخواست ۾ اھي وارث سان پريشاني سبب ڪري سگهو ٿا ڪجهه CSS ۾ ٽيوٽوريل، سڃاڻپ جي استعمال جي سفارش نه ڪندا آھن. جڏهن ته، ڪيترن ئي ماهرن جو زور ڏئي انھن جي ترتيب اهڙي بندوبست آهن. توهان جو فيصلو. # »), затем имя блока. جي جئر نشاني ( "#")، پوء جي بلاڪ جو نالو: و نحو جو ڏنل آهي. #red. مثال طور، #red.

отличается от класса по нескольким параметрам. سڃاڻپ ڪيترن ئي طريقن ۾ ڪلاس کان مختلف آهي. ID. پهريون، صفحو ٻه هڪجهڙائي سڃاڻپ نه ٿي سگهي. اهي هڪ منفرد جي نالي سان سلهاڙيل آهن. ٻيو، اهڙي selector هڪ تمام اعلي اوليت ڪئي. red и укажете в таблицах CSS красный цвет фона, а затем назначите ему же id blue и укажете синий цвет, блок станет синим. مطلب هي آهي ته جيڪڏهن توهان هڪ يونٽ طبقي لال ڄاڻائي ۽ CSS ٽيبل ۾ لال ڄاڻائي پس منظر جو رنگ، ۽ وري به ساڳئي ID نيري ان کي مقرر ۽ رنگ نيرو ڄاڻائي، جي يونٽ نيري رنگ ڦري ويندا.

فائدن - توهان جي مخصوص هدايت ڪنٽرول ڪري سگهو ٿا، ٽيگ ۽ طبقن جي انداز ڏيندو هو.

ID и class. وڌڻ - ID ۽ طبقي جي هڪ وڏي انگ ۾ گم ٿي حاصل ڪرڻ آسان.

اهم! ID вам, в общем-то, не нужны. توهان BEM منھجي (يا ان جي analogues) استعمال ڪري رهيا آهيو، ته توهان کي سڃاڻپ، عام ۾، جي ضرورت نه آهي. هيء ٽيڪنڪ ته گهڻو وڌيڪ آسان ترتيب منفرد طبقن جي استعمال ۾ شامل ٿي.

آفاقي selector

{}. نحو: Starlets نشاني ( "*") ۽ braces، يعني، {*} ...

صفحي جي سمورن مرحلن دوران هڪ دفعو ڪجهه صفتون مقرر ڪرڻ لاء استعمال ڪري. جڏهن هن مفيد ٿي سگهي ٿو؟ box-sizing: border-box. مثال طور، توهان جي صفحي مال خاني-sizing قائم ڪرڻ چاهيو ٿا ته: سرحد-خاني. div *{}. سنڌ جي مخصوص بلاڪ جي سڀني ٻارن کي ڪنٽرول ڪرڻ جي سند جي سڀني حصن کي منظم ڪرڻ جي استعمال ڪري نه رڳو ٿو، پر به، مثال طور، div * {}.

فائدن - توهان هڪ وقت ۾ شيون جي هڪ وڏي انگ کي ڪنٽرول ڪري سگهو ٿا.

اوگڻ - ڪافي نه لچڪدار اختيار. ان کان سواء، هن selector جي استعمال، ڪن حالتن ۾ ته صفحو ڪم نازل سست.

جزن جي

ان جو هڪ خاص وصف سان هدايت ڪنٽرول ڪرڻ جي لحاظ کان ڪر. مثال طور، توهان هڪ مختلف وصف قسم کڻي ايوانن ٽيگ جو هڪ انگ آهي. انهن مان هڪ - متن، ٻيو - پاس ورڊ، ٽيون - نمبر. جي حقيقت، تون هر طبقي يا سڃاڻپ قائم ڪري سگهي ٿو، پر ان کي هميشه آسان نه آهي. جزن جي CSS selectors ان لحاظ کان وڌ ۾ وڌ سڌائي سان ڪجهه ٽيگ لاء انهيء ڄاڻائي کي ٻڌائي. مثال طور، هن طرح:

ان پٽ [قسم = 'جملا'] {}

هن selector پٽ متن جي قسم سان سڀ صفتون چونڊيو ويندو.

هن اوزار ڪافي لچڪدار آهي ۽ ان جي ٽيگ جي ڪنهن سان استعمال ڪري سگهجي ٿو، جنهن ۾ جزن ۾ نه ٿي سگهي. پوء ته سڀ نه آهي! هن CSS specification کان به وڌيڪ سهولت سان عنصرن کي ڪنٽرول ڪرڻ جي صلاحيت آهي!

تصور پنهنجي صفحو جي وصف placeholder = "جو نالو شامل ڪريو" ۽ پٽ placeholder = "پاسورڊ داخل ڪريو" سان پٽ آھي. اهي به selector استعمال ڪرڻ جي چونڊ ڪري سگهجي ٿو! هن ڪندا، هيٺ ڏنل جوڙجڪ استعمال:

ان پٽ [placeholder = "جو نالو لکو"] {} يا پٽ [placeholder = "جو ڳجھو لفظ لکو"]

جزن سان شايد وڌيڪ لچڪدار ڪم. جي چوندا آھن توهان جهڙيون صفتون عنوان (مثال طور، "ڪئسپين" ۽ "ڪئسپين") سان ٽيگ جو هڪ انگ آهي جڳائي. ٻنهي کي منتخب ڪرڻ لاء، هيٺين گولھي استعمال:

[عنوان * = "Kaspiysk"]

CSS جي عنوان جنهن جو ڪو "ڪئسپين"، يعني. ئ، ۽ "ڪئسپين" ۽ "ڪئسپين" جو نشان آهن ۾ سڀ شيون چونڊيو ويندو.

تون به ٽيگ ته هڪ خاص ڪردار جزن سان شروع ڪري سگھو ٿا:

[عنوان ^ = "ڪردار توهان چاهيو ٿا"] {}

يا انھن کي ٻاهر خارج ڪيا:

[عنوان $ = "حق ڪردار"] {}.

فائدن - وڌ ۾ وڌ زور ڏنو. توهان جي طبقن سان messing کان سواء ڪنهن به موجود صفحو عنصرن کي منتخب ڪري سگهو ٿا.

وڌڻ - نسبتا خال خال استعمال ڪيو، رڳو مخصوص حالتن ۾. ڪيتريون ئي ويب دارو مدار، منھجي کي ترجيح کان نڪتو طبقي جي پهچ جا ٻيا به بندوبست ڪرڻ کان آهي چورس brackets ۽ نشانين "برابر". ان کان سواء، انهن selectors انٽرنيٽ ايڪسپلورر ورجن 7 ۽ دريء ۾ ڪم نه ڪندا آھن. تنهن هوندي به، جيڪي هاڻي پراڻي انٽرنيٽ ايڪسپلورر جي ضرورت آهن؟

pseudo-طبقاتي selectors

هڪ pseudo-حيثيت هدايت Denotes. مثال طور ،: hover - ڇا جي صفحي جو حصو کي هاڻي جڏهن توهان hover ،: آيو - جو دورو ڪيو ڪڙي. پهريون-ٻار ۽:: آخري-ٻار اهو به جيئن عناصر شامل آهن.

selector اهڙي قسم جا زور ڏئي، ڇاڪاڻ ته ان جي مهرباني توهان JavaScript جي استعمال کان سواء هڪ صفحو "رهن ٿا" ٻڌائي ٿو، جديد ترتيب ۾ استعمال ڪيو ويندو آهي. مثال طور، توهان کي پڪ آهي ته توهان جي btn ان جو رنگ تبديل ٿي هن طبقي سان بٽڻ تي hover جڏھن ڪرڻ چاهيون ٿا. هن ڪندا، اسان جي ڏنل جوڙجڪ استعمال:

.btn: hover {

پس-رنگ: لال؛

}

حسن جي بٽڻ جي بنيادي مال ۾ متعين ڪري سگهي ٿو ڪري سگهجي، جي عبوري مال، مثال طور، 0.5s - هن معاملي ۾، هن بٽڻ تي فوري شرمايو نه ڪندو، ۽ اڌ هڪ ٻئي جي اندر.

نيڪي - وڏي پيماني جي صفحن جو "جاڳرتا" لاء استعمال ڪري رهيا آهن. استعمال ڪرڻ آسان.

وڌڻ - اهي نه آهن. هيء هڪ حقيقت پسندي ڪارائتي ثابت اوزار آهي. تنهن هوندي به، جو فرزند ويب دارو مدار pseudo-طبقن جو گھڻو ۾ گم ٿي حاصل ڪري سگهي ٿو. هن مسئلي جي مطالعي ۽ عملي طور حل آهي.

pseudo-selectors

"Pseudo" - اهي ته HTML پوسٽ ۾ نه آهن جو صفحو جي حصن آهن، پر اهي اڃا تائين منظم ڪري سگهجي ٿو. توهان کي سمجهڻ نه ڪيو؟ اهو گهڻو پهچ کان ان کي لڳي آهي. مثال طور، توهان کي اهو جملو وڏي ۽ ڳاڙهي ۾ پهريون خط، سنڌ جي ٻين ننڍن ۽ ڪارو متن پيدا ڪرڻ چاهيون ٿا. جي حقيقت، ان جي هڪ خاص طبقي سان هڪ جي وٿيء تي آهي ته خط سودي ڪري سگهجي ٿو، پر ان کي ايتري ۽ خواهش آهي. اهو گهڻو آسان پوري تڪ چونڊيو ۽ pseudo استعمال ڪرڻ :: اول خط آهي. اهو پهريون خط جي ظاهر سنڀالڻ جو موقعو ڏنو.

ڪافي pseudo-عنصرن جي هڪ وڏي تعداد ۾ ڪري سگهو ٿا. انھن کي ھڪ مقالي ۾ ڪامياب ٿيڻ بعيد آهي ۾ فهرست. توهان پنهنجي پسنديده سرچ انجڻ ۾ لاڳاپيل معلومات ڏسي سگهو ٿا.

فائدن - جي صفحي کي نظر ۾ معيا ڪرڻ جي سکيائي مهيا ڪري.

وڌڻ - انھن لاء نئين اڪثر ڦري ويا آهن. صرف ڪجهه برائوزرن ۾ ڪم جي هن قسم جي ڪيترن ئي گولھي.

summarize لاء

Selector - سند جي وهڪري جي قبضي لاء هڪ طاقتور اوزار. کيس ڪرڻ جي مهرباني، توهان جي صفحي جي هر هڪ کي اتحاد چونڊيو ڪري سگهو ٿا (اتي به رڳو جزوي آهي). سنڌ جي سڀني اختيارن موجود معلوم ٿئي ٿو، يا اڃا به کين لکندا کي پڪ ٿي. هن خاص طور تي اهم جيڪڏھن اوھان کي هڪ جديد ڊيزائن ۽ وچڙ عنصرن جو پکو کڻي پيچيده صفحا ٺاهي آهي.