Számold ki a CSS-specificitást, és derítsd ki, melyik szabály nyer
Illessz be szelektorokat a specificitásuk kiszámításához, vagy CSS-t és egy elemet, hogy lásd, melyik szabály érvényesül.
- A készüléken fut
- Regisztráció nélkül
- Látogatás után offline is működik
Böngészőstílusok és más stíluslapok nincsenek benne. Semmit nem küldünk sehová.
| Szelektor | Specificitás | Súly | Kontextus |
|---|
| Szabály | Érték | Specificitás | Réteg | Eredmény |
|---|
Hogyan derítsd ki, melyik CSS-szabály nyer
- Válassz módot: szelektorok számolása, vagy a győztes szabály keresése.
- Illeszd be a szelektorokat, vagy a CSS-t, a HTML-t és a tulajdonságot.
- Olvasd le a pontszámot, vagy a győztest, és azt, miért vesztett a többi szabály.
Kérdések
Hogyan számítódik a specificitás?
Minden id 1,0,0-t ér, minden osztály, attribútum vagy pszeudo-osztály 0,1,0-t, minden elemnév vagy pszeudo-elem 0,0,1-et. Az univerzális szelektor és a :where() nem ér semmit.
Hogyan számol a :is(), :not() és :has()?
A legerősebb argumentumuk szerint számítanak. Így a :is(#a, .b) p 1,0,1 pontot kap, mert a :is() belsejében a #a a legerősebb rész. A :where(#a) p szabály 0,0,1 pontot kap.
Miért veszít egy rétegezett szabály egy egyszerű szabály ellen?
Normál deklarációknál a rétegeken kívüli szabályok nyernek a rétegekben lévők ellen. Az !important esetén a sorrend megfordul, így a korábbi réteg nyer. Egy normál style-attribútum minden normál stíluslapszabályt legyőz, az !important style-attribútum pedig minden más !important szabályt.
Elküldi valahova a CSS-emet?
Nem. A böngésződ ebben a lapon értelmezi és illeszti a szelektorokat, és semmit sem küld szerverre.
Vélemények
Még nincs vélemény. Legyél te az első.