Pradžia CSS
CSS remiasi modelio atitikties taisyklėmis, kad nustatytumėte, kuris stilius taikomas kuriam dokumento elementui. Šie modeliai vadinami selektoriais ir nuo žymeklių pavadinimų (pvz., P, kad atitiktų pastraipų žymas) būtų labai sudėtingi modeliai, atitinkantys labai konkrečias dokumento dalis (pvz., P # myid> b.highlight atitiks bet kurią b žymą su klasė pabrėžti, kad yra pastraipos vaikas su ID idėja).
CSS parinkiklis yra CSS stiliaus skambučio dalis, nurodanti, kokia dalis turėtų būti tinklalapio dalis. Rinkiklis turi vieną ar daugiau savybių, kurios apibrėžia, kaip bus pasirinktas pasirinktas HTML .
CSS selektoriai
Yra keletas skirtingų tipų selektorių:
- tipo selektoriai, atitinkantys tam tikrą elementą
- klasių selektorių atitikimo elementai su konkrečia klase
- ID atrankai - elemento atitikimas konkrečiam ID
- palikuonių selektoriai-atitinkantys elementai, kurie yra konkretaus elemento palikuonys
- vaikų selektorių atitikimo elementai, kurie yra konkretaus elemento vaikas
- universalūs selektoriai - kiekvieno elemento atitikimas
- gretimų brolių selektorių atitikimo elementai, prieš kuriuos yra prieš konkretų elementą
- atributų selektorių atitikimo elementai su konkrečia atributo arba atributo reikšme
- pseudo klasės selektorių atitikimo elementai su konkrečia pseudo klasė
- pseudoelementų selektorių atitikimo elementai su specifinėmis pseudoelementinėmis savybėmis
Formatuoti CSS stilius ir CSS selektoriai
CSS stiliaus formatas atrodo taip:
selektorius {style properties: style; }
Atskirkite kelis selektorius, kurių kableliais yra tas pats stilius. Tai vadinama selektorių grupe. Pavyzdžiui:
selector1 , selector2 {style property: style; }
Grupavimo selektoriai yra stenografavimo mechanizmas, kad CSS stilius būtų kompaktiškas.
Pirmiau minėta grupė turėtų tokį patį poveikį:
selector1 {stiliaus savybė: stilius; }
selector2 {stiliaus savybė: stilius; }
Visada patikrinkite CSS rinkiklius
Ne visos naršyklės palaiko visus CSS selektorius. Todėl būtinai išbandykite savo selektorių tiek daugelyje naršyklių, kiek galite operacinėse sistemose. Bet jei naudojate CSS 1 arba CSS2 rinkmenas, jums turėtų būti gerai.