Css öröklés, lépcsőzetes, a szelektorok sajátossága

Ebben a fejezetben:

öröklés

Egy elem stílusának megadásakor a tulajdonságok egy részét örökölhetik gyermekeik és leszármazottaik, ezt a hatást örökségnek nevezik.







Például minden elem egy elem belsejében . gyermekei és leszármazottai. Ha a stílus a állítsa be a szövegszín színes színét a CSS színnel, az összes gyermekének és leszármazottjának szövegszíne is pirosra változik:

Az öröklendő tulajdonságokat felülbírálhatja, ha egyedi szabályt alkalmaz a kívánt elemre:

Annak megállapításához, hogy mely CSS tulajdonságok örökölnek, és amelyek nem, meg kell nézni egy adott tulajdonság leírását a CSS hivatkozásban.

A szelektorok specifikusságának (prioritásának) kiszámítása

A tervezési stílus számos módon alkalmazható a kívánt elemre. De mi történik, ha egy elem kettő vagy több kölcsönösen kizáró szelektort választ? Ez a dilemma a CSS két elve alapján oldható meg: a szelektorok és a kaszkád sajátossága.

A szelektorok sajátossága (választópecifikussága) határozza meg prioritásaikat a stíluslapon. Minél pontosabb a választó, annál nagyobb a prioritása. A választó specifikusságának kiszámításához három számcsoportot (a, b, c) használunk, a számítás a következőképpen történik:

  • Megszámolja az azonosítók számát a választóban (a csoport)
  • Az osztály-, attribútum- és pszeudoosztály-szelektorok száma a választóban (b csoport)
  • A szelektorban lévő típusválasztók és pszeudoelemek száma (c csoport)
  • Selector belül tagadás pszeudo-osztály (: nem) tekinthető, mint bármely más választó, de a tagadás pszeudoosztályban nem vesz részt a számítás a választó
  • Az univerzális választó (*) és a kombinátorok nem vesznek részt a választó súlyának kiszámításában






Az alábbi példában a szelektorok specifikusságuk növelésének sorrendjében rendeződnek:

A legmagasabb prioritás az "a" csoporttól szám, a "b" csoport átlagos prioritása, a "c" csoport számának legalacsonyabb prioritása van. A különböző csoportokból származó számok nem foglalhatók össze közösen; vegye példa utolsó sorban a sajátossága a választó „101” - ez nem jelenti azt a számot a „százegy”, ami azt jelenti, hogy az egyik választó csoport «a» használunk (azonosító) és egy választó csoport «c» (választó).

a Cascade

A Cascading a CSS egyik jellemzője, amelynek segítségével a böngésző meghatározza, hogy milyen tulajdonságok kerülnek alkalmazásra egy elemre, amikor tulajdonságok ütközik. Tulajdonság-konfliktus akkor fordul elő, amikor több olyan szabályt definiálnak egy olyan elem számára, amelynek szelektora ugyanaz a specifikussága, és ugyanazokat a tulajdonságokat tartalmazza, de különböző értékekkel rendelkezik.

A Cascade a következőképpen működik: ha a stíluslap egyetlen elem által meghatározott bizonyos szabályok, szelektor amelynek ugyanaz a specifitása, és magukban foglalják az ütköző jellemzőit, az elem értéke az ütköző tulajdonság be van állítva a szabály, amely alatt elhelyezett tábla stílusok:

Ha egy elemre vonatkozó különböző szabályok olyan tulajdonságokat tartalmaznak, amelyek nem ütköznek össze, akkor egy stílussá alakulnak, azaz minden új szabály új stílusinformációt ad a fenti szabályhoz:

A fenti példa kódja megegyezik az alábbi példában szereplő kóddal, amelyben mindhárom tulajdonság egy szabályban van megadva:

Általában egy elemre vonatkozó további szabályok kerülnek meghatározásra azokban az esetekben, amikor egyszerre több elemet adtak meg egy stílusnak, de ehhez hozzá kell adnia egy mást is egy bizonyos elemhez: