12-css-pokrocile-selektory.md

Pokročilé selektory

---

Vícenásobný selektor

.tip,
h2 { 
    color: green; 
}

• obarví prvky s třídou .tip a nadpisy 2. úrovně na zeleno
• každý selektor na nový řádek, aneb za čárkou odřádkovat

---

Kontextový selektor

.tip h2 { 
    color: blue; 
}

• obarví nadpisy 2. úrovně na modro, pokud jsou v prvku s třídou .tip
• odpovídá zanořování v HTML
• tady má mezera význam (jinde na nich tolik nezáleží)

---

Na pořadí záleží

p {
    color: red;
    background-color: pink;
}

p { color: green; }

• platí poslední nastavená hodnota vlastnosti
• často se stane, že zadáte znovu tutéž vlastnost. Když dbáte na úpravu 1 pravidlo na řádek, snáz to odhalíte. (Jsou i automatizované nástroje, které to hlídají za nás.)

---

Zjednodušujeme kód