Co jsou vestavěné styly a jaké je jejich pořadí priority?
sobes.tech AI
Odpověď od AI
Vložené styly jsou styly, které jsou přímo definovány v HTML prvku pomocí atributu style.
<p style="color: red;"> Tento text bude červený </p>
Priorita vložených stylů je nejvyšší ze všech způsobů definice stylů v CSS. Přepisují styly z externích stylových tabulek (.css), styly z bloků <style> v <head> a děděné styly od rodičovských prvků. Výjimkou jsou pravidla s příznakem !important.
Příklad priorit (od nejvyšší po nejnižší, při stejné specifitě):
- Pravidla s
!important(nedoporučuje se používat). - Vložené styly (
styleatribut). - Externí stylové tabulky (
<link rel="stylesheet">). - Vnitřní styly (
<style>blok v<head>). - Děděné styly.
- Výchozí styly prohlížeče.
Vložené styly mají specifitu odpovídající ID selektoru (#id).
Hlavní nevýhodou vložených stylů je nízká udržovatelnost. Znesnadňují centrální správu stylů, komplikují refaktoring a vedou ke duplicitě kódu. Proto se doporučuje jejich používání omezit, například pro dočasné ladicí styly nebo v komponentách, kde jsou styly dynamicky vypočítávány a vázány na konkrétní prvek.