Co je to selektor v CSS?

Selektor v CSS je vzor, který určuje, na které HTML prvky se aplikují styly. Určuje prohlížeči, které jeden nebo více prvků má být vybráno.

Existují různé typy selektorů:

Typové selektory (Type selectors): Vyberou všechny instance HTML prvku.
```
p { /* Vybere všechny odstavce */
  color: blue;
}
```

Třídní selektory (Class selectors): Vyberou prvky s určitým hodnotou atributu class.

.highlight { /* Vybere všechny prvky s třídou "highlight" */
  background-color: yellow;
}

ID selektory (ID selectors): Vyberou jediný prvek s určitým hodnotou atributu id.
```
#header { /* Vybere prvek s id "header" */
  font-size: 2em;
}
```

Univerzální selektor (Universal selector): Vybere všechny prvky.

* { /* Vybere všechny prvky na stránce */
  margin: 0;
  padding: 0;
}

Atributové selektory (Attribute selectors): Vyberou prvky na základě přítomnosti nebo hodnoty jejich atributů.
```
[type="text"] { /* Vybere všechny inputy s type="text" */
  border: 1px solid gray;
}
```

Pseudo-třídy (Pseudo-classes): Vyberou prvky na základě jejich stavu.

a:hover { /* Vybere odkaz při najetí myší */
  text-decoration: underline;
}

Pseudo-prvky (Pseudo-elements): Vyberou určité části prvku nebo vytvoří "fiktivní" prvky.
```
p::first-line { /* Vybere první řádek odstavce */
  font-weight: bold;
}
```

Kombinátory (Combinators): Určují vztahy mezi selektory.

Kombinátor	Popis	Příklad
Mezery ( )	Selektor potomků (Descendant selector)	`div p`
`>`	Selektor dětí (Child selector)	`div > p`
`+`	Selektor sousedního sourozence (Adjacent sibling selector)	`h1 + p`
`~`	Selektor všeobecných sourozenců (General sibling selector)	`h1 ~ p`

Selektory lze kombinovat pro přesnější určení prvků.