Začiatok CSS
CSS sa spolieha na pravidlá zhody vzoru, aby určil, ktorý štýl sa vzťahuje na ktorý prvok v dokumente. Tieto vzory sa nazývajú selektory a pohybujú sa od názvov značiek (napríklad p, ktoré zodpovedajú značkám odseku) až po veľmi zložité vzory, ktoré sa zhodujú s veľmi špecifickými časťami dokumentu (napríklad p # myid> b.highlight by zodpovedal akémukoľvek b tagu s trieda zvýraznenia, ktorá je dieťaťom odseku s id myid).
Volič CSS je súčasťou volania štýlu CSS, ktorý identifikuje, ktorá časť webovej stránky by mala byť štylizovaná. Selektor obsahuje jednu alebo viac vlastností, ktoré určujú, ako bude vybraný HTML štýlový.
Výbery CSS
Existuje niekoľko rôznych typov voličov:
- typu selektorov, ktoré zodpovedajú konkrétnemu prvku
- triedy selektory-zodpovedajúce prvky s určitou triedou
- ID selectors - zodpovedajúce prvku s konkrétnym ID
- výberové sekvencie - elementy, ktoré sú potomkami určitého prvku
- detské selektory zodpovedajúce prvky, ktoré sú dieťaťom konkrétneho prvku
- univerzálny výber - zodpovedajúci ľubovoľnému prvku
- priľahlých selektorov súrodencov - zodpovedajúce prvky, ktoré bezprostredne predchádza špecifický prvok
- atribúty atribútov výberových prvkov s určitým atribútom alebo hodnotou atribútu
- pseudotrieda selektorov-zhody prvkov so špecifickou pseudotriedou
- prvky pseudo-prvkových selektorov - zodpovedajúce prvky so špecifickými vlastnosťami pseudo-prvkov
Formátovať štýly CSS a výbery CSS
Formát štýlu CSS vyzerá takto:
selektor {vlastnosť štýlu: štýl; }
Oddeľte viacero výberov, ktoré majú rovnaký štýl s čiarkami. Toto sa nazýva zoskupenie voličov. Napríklad:
selector1 , selector2 {vlastnosť štýlu: štýl; }
Zoskupovanie voličov je skrátený mechanizmus, ktorý zachová kompaktné štýly CSS.
Vyššie uvedené zoskupenie by malo rovnaký účinok ako:
selector1 {vlastnosť štýlu: štýl; }
selector2 {vlastnosť štýlu: štýl; }
Vždy si vyskúšajte výbery CSS
Nie všetky prehliadače podporujú všetky voľby CSS. Nezabudnite teda vyskúšať svoje výberové zariadenia v čo najväčšom počte prehliadačov v čo najväčšom počte operačných systémov. Ale ak používate selektory CSS 1 alebo CSS2, mali by ste byť v poriadku.