Sobes.tech
Junior

Čo sú to zabudované štýly a aký je ich priorita?

sobes.tech AI

Odpoveď od AI

Vložené štýly sú štýly, ktoré sú priamo definované v HTML prvku pomocou atribútu style.

<p style="color: red;"> Tento text bude červený </p>

Priorita vložených štýlov je najvyššia zo všetkých spôsobov definície štýlov v CSS. Prepisujú štýly z externých štýlových tabuliek (.css), štýly z blokov <style> v <head> a zdedené štýly od rodičovských prvkov. Výnimkou sú pravidlá s príznakom !important.

Príklad priorít (od najvyššej po najnižšiu, pri rovnakej špecifickosti):

  1. Pravidlá s !important (neodporúča sa používať).
  2. Vložené štýly (style atribút).
  3. Externé štýlové tabuľky (<link rel="stylesheet">).
  4. Vnútorné štýly (<style> blok v <head>).
  5. Zdedené štýly.
  6. Predvolené štýly prehliadača.

Vložené štýly majú špecifickosť rovnakú ako ID selektor (#id).

Hlavnou nevýhodou vložených štýlov je nízka udržiavateľnosť. Znepríjemňujú centralizované riadenie štýlov, sťažujú refaktoring a vedú k duplikácii kódu. Preto sa odporúča ich obmedziť, napríklad na dočasné ladenie štýlov alebo v komponentoch, kde sa štýly dynamicky počítajú a viažu na konkrétny prvok.