CSS specifitás

A CSS specifitás határozza meg, hogy amikor több stílus szabály is érvényes ugyanarra az elemre, akkor melyik fog érvényesülni. Ez kulcsfontosságú a stíluslapok konfliktusainak megértéséhez.

Alapfogalmak

A specifitás egy számérték, amelyet a böngésző használ a szabályok súlyozására. Az elemek, osztályok és azonosítók különböző pontszámot érnek.

Az alábbi példa megmutatja, hogyan érvényesülnek az elem, osztály és azonosító szelektorok.

Pontozási rendszer

A specifitás értékek különböző kategóriákból állnak: inline stílus, ID, osztály és elem. Minél magasabb a pontszám, annál erősebb a szabály.

Szelektor	Specifitás érték
Element selector (p, div)	0-0-1
Class selector (.class)	0-1-0
ID selector (#id)	1-0-0
Inline style	1-0-0-0 (highest)

A !important használata

A !important deklaráció felülír minden specifitást, ezért óvatosan kell használni. Csak akkor használd, ha valóban nincs más megoldás.

Tippek a specifitáshoz

A specifitás kezelése segít tisztán tartani a kódot és elkerülni a hibás megjelenést. Íme néhány praktikus tanács:

Kerüld a túl magas specifitású szelektorokat, hogy könnyebb legyen a felülírás.
Szervezz logikusan, és használd az osztályokat inkább, mint az ID-ket.
A !important használatát tartsd a minimumon, hogy ne okozzon átláthatatlan konfliktusokat.