Kalkulator specifičnosti CSS-a
Izračunaj specifičnost CSS selektora i vidi koji će pobijediti.
Kalkulator specifičnosti CSS-a
Zalijepi jedan ili više CSS selektora, jedan po redak, i ovaj alat izračunava specifičnost svakog kao standardnu trojčlanu ocjenu: ID-eve, klase (plus atribute i pseudo-klase) i elemente (plus pseudo-elemente). Specifičnost određuje koju od sukobljenih pravila preglednik primjenjuje, pa je korisna kada dva pravila stilova ciljaju isti element i trebas znati koje će pobijediti, ili kada debuggiraš zašto override nije učinkovit.
Uključi Podijeli zarez-odvojene popise kako bi svaki selektor u popisu poput ".a, .b" bio ocjenjivan na svojoj liniji umjesto da se kombiniraju u jedan. Sortiraj od najjačeg prema najslabijemu preureduje rezultate od najveće specifičnosti prema najmanjoj. Odaberi Tablica za raspored sa stupcima ID-eva, klasa i elemenata razvrstanih, ili 0-1-2 notacija za kompaktan rezultat poput "1-0-2" po selektoru. Prikaži pojašnjenje razrade nabraja koji dio svakog selektora — ID, klasa, element — je priložio specifičnosti, što je najbrži način da vidis točno zašto jedno pravilo nadmašuje drugo.
Kalkulator slijedi CSS Selectors specifikaciju za tešće slučajeve: :where() uvijek boduje nula bez obzira što se nalazi u njoj, dok :is(), :not() i :has() preuzimaju specifičnost svog najspecifičnijeg argumenta. Selektor koji sadrži !important je označen, jer nadjačava normalnu kaskadu bez obzira na specifičnost i vrijedi znati to čak i premda nije dio vlastitog rezultata selektora. Windows i Unix završetci linija tretiraju se jednako, a prazne linije se ignoriraju.
Svega se izvršava lokalno u tvojem pregledniku — selektori koje zalijepiš nikada se nigdje ne slaju, što je važno ako provavavaš privatnu bazu koda. Kopiraj rezultat, preuzmi ga kao .txt datoteku, ili ponovno pošalji izlaz u unos kako bi nastavio s poboljšanjem svojih selektora.