Čo je CSS?

Kaskádové štýly (Cascading Style Sheets) — jazyk štýlov používaný na opis zobrazenia dokumentu napísaného v jazyku značiek (HTML, XHTML, SVG, XML).

Hlavné funkcie CSS:

Oddelenie zobrazenia od obsahu: Umožňuje zmeniť vzhľad webovej stránky bez úprav jej štruktúry.
Štylizácia prvkov: Riadenie farieb, fontov, veľkostí, medzier, okrajov a ďalších vizuálnych vlastností prvkov.
Vytváranie responzívneho dizajnu: Pomocou media queries je možné aplikovať rôzne štýly v závislosti od vlastností zariadenia používateľa (rozlíšenie obrazovky, orientácia atď.).
Animácie a prechody: Vytváranie vizuálnych efektov pre interaktivitu a zlepšenie používateľského zážitku.
Riadenie rozloženia: Pozicionovanie prvkov na stránke pomocou rôznych techník (Flexbox, Grid, floaty atď.).

Štruktúra pravidla CSS:

/* Selektor */
h1 {
  /* Deklarácie */
  color: blue; /* Vlastnosť: hodnota; */
  font-size: 24px;
}

Hlavné spôsoby pripojenia CSS k HTML dokumentu:

Vonkajší súbor (<link>): Najrozšírenejší a odporúčaný spôsob. Štýly sú uložené v samostatnom .css súbore.
```
<link rel="stylesheet" href="styles.css">
```
Vnútri <style> tagu: Štýly sú definované priamo v HTML dokumente, zvyčajne v sekcii <head>. Vhodné pre menšie štýly alebo rýchle testovanie.
```
<style>
  p {
    line-height: 1.5;
  }
</style>
```
Inline štýly (style atribút): Štýly sa aplikujú na konkrétny HTML prvok pomocou atribútu style. Má vysoký prioritu, ale sťažuje údržbu a škálovanie.
```
<div style="border: 1px solid black;">
  Toto je div s inline štýlom.
</div>
```

Kaskádovosť určuje, ako prehliadač aplikuje štýly pri viacerých pravidlách, ktoré sú v konflikte pre jeden prvok. Zohľadňujú sa:

Priorita selektorov: Špecifickejšie selektory majú vyššiu prioritu.
Poradie: Pravidlá, ktoré sú deklarované neskôr, prepisujú staršie pravidlá s rovnakou prioritou.
Dôležitosť (!important): Deklarácia s !important má najvyššiu prioritu (treba ju používať opatrne).
Zdroj štýlov: Štýly autora majú vyššiu prioritu ako štýly používateľa alebo predvolené štýly prehliadača.