Tudod, hogy a választókat

előző ◈ a következő

CSS3-szelektor - alapvetően jó dolog.

Ezért a választókat kell tudni.

Főbb típusai szelektor néhány:

  • * - bármilyen terméket.
  • div - elemek ilyen tag.
  • #id - elem id adatokat.
  • .osztály - elemek ilyen osztályt.
  • [Name = "érték"] - szelektorok attribútum (lásd alább.).
  • : Meglátogatott - «ál-osztály”, a többi különböző feltételeket a tételt (lásd alább)..

Selectors kombinálható írásban következetesen, szóköz nélkül:

  • .c1.c2 - elemek egyidejűleg két osztály C1 és C2
  • a # id.c1.c2: meglátogatott - egy elem egy adott id. osztályok c1 és c2. és az ál-látogatott

A CSS3 Négyféle közötti kapcsolatok az elemeket.

A legismertebb valószínűleg tudod:

  • div p - elemek o. leszármazottai a div.
  • div> p - csak a közvetlen leszármazottai

Van még két ritka:

p - jobb szomszédok: p minden ugyanazon a szinten a fészkelő, hogy menjen utána div.
  • div + p - első jobb oldali szomszédja: p ugyanazon a szinten a hierarchia, ami után következő div (ha van ilyen).

    • Nézzünk egy példát HTML:

    első gyermek - az első gyermek a szülő.

    last-gyerek - az utolsó leszármazottja a szülő.

    Csak-gyermek - az egyetlen leszármazottja a szülő, sem a szomszédos elemek.

    n-ed gyermek (a) - leszármazottja több szülő, például: n-ed gyermek (2) - a második gyermek. A számozás kezdődik 1.

    n-ed gyermek (an + b) - kiterjesztése az előző szelektor számának megadásával leszármazottja általános képletű, ahol a, b - állandó, és azt jelenti, bármely egész szám alatt a n.

    Ez ál kiszűri az összes elem, hogy általános képlet alá esnek, ha bármely n. Például: -: n-ed gyermek (2n) ad elemeinek száma 2. 4. 6. ..., azaz a páros.

    • : N-ed gyermek (2n + 1) elemek, így a szám 1 ... 3, hogy a páratlan.
    • : N-ed gyermek (3n + 2) elemek number 2. 5. 8., és így tovább.

    Példa a használatra elosztására a lista:

    előző ◈ a következő