#1 CSS selektory
Selektory jsou v jazyce CSS vzory, které slouží k výběru prvků, které chcete stylovat.
| Selektor | Příklad | Popis |
|---|---|---|
| .class | .trida | Vybere všechny prvky s class="trida" |
| .class1.class2 | .jmeno1.jmeno2 | Vybere všechny prvky, které mají v atributu class nastaveno jmeno1 i jmeno2 |
| .class1 .class2 | .jmeno1 .jmeno2 | Vybere všechny prvky s jmeno2, které jsou potomkem prvku s jmeno1 |
| #id | #firstname | Vybere prvek s id="jméno" |
| * | * | Vybere všechny prvky |
| element | p | Vybere všechny prvky <p> |
| element.class | p.trida | Vybere všechny prvky <p> s class="trida" |
| element,element | div, p | Vybere všechny <div> prvky a všechny <p> prvky |
| element element | div p | Vybere všechny <p> prvky v prvcích <div> |
| element>element | div > p | Vybere všechny <p> prvky kde rodičem je <div> prvek |
| element+element | div + p | Vybere první prvek <p> v <div> prvku |
| element1~element2 | p ~ ul | Vybere každý prvek <ul>, kterému předchází prvek <p> |
| [attribute] | [target] | Vybere všechny prvky s atributem target |
| [attribute=value] | [target="_blank"] | Vybere všechny prvky s příznakem target="_blank" |
| [attribute~=value] | [alt~="obrazek"] | Vybere všechny prvky s atributem alt obsahujícím slovo „obrazek“ |
| [attribute|=value] | [lang|="cs"] | Vybere všechny prvky s hodnotou atributu lang rovnou "cs" nebo začínající na "cs-" |
| [attribute^=value] | a[href^="http"] | Vybere každý <a> prvek u kterého href hodnota začíná "http" |
| [attribute$=value] | a[href$=".php"] | Vybere každý <a> prvek u kterého je koncovka .php |
| [attribute*=value] | a[href*="piskod"] | Vybere každý prvek <a>, jehož hodnota atributu href obsahuje podřetězec "piskod" |