CSS/Selektorid

Allikas: Vikiõpikud
< CSS
(Ümber suunatud leheküljelt CSS:Selektorid)


Allolev tabel annab ülevaate kõigist CSS1, CSS2 ja CSS3 selektoritest. Viimane tulp "CSS-i versioon" näitab seda, millises CSS-i versioonis vastav selektor esmakordselt defineeriti.

CSS-i selektorid
Muster Tähendus CSS-i versioon
* kõik elemendid CSS2
E element tüübist E CSS1
E[foo] element E, millele on määratud atribuut foo CSS2
E[foo="bar"] element E, mille atribuudi foo väärtus on täpselt võrde väärtusega "bar" CSS2
E[foo~="bar"] element E, mille atribuudi foo väärtuseks on rida tühikuga eraldatud väärtusi, milledest üks on täpselt võrdne väärtusega "bar" CSS2
E[foo^="bar"] element E, mille atribuudi foo väärtus algab sõnega "bar" CSS3
E[foo$="bar"] element E, mille atribuudi foo väärtus lõpeb sõnega "bar" CSS3
E[foo*="bar"] element E, mille atribuudi foo väärtus sisaldab alamsõnet "bar" CSS3
E[hreflang|="et"] element E, mille atribuudi hreflang väärtuseks on rida sidekriipsuga eraldatud väärtusi, millest esimene (vasakpoolseim) on võrdne väärtusega "et" CSS2
E:root element E, mis on dokumendu juurelemendiks CSS3
E:nth-child(n) element E, oma vanema n-is laps CSS3
E:nth-last-child(n) element E, oma vanema n-is laps, alustades loendamist viimasest CSS3
E:nth-of-type(n) element E, n-is E-tüüpi element CSS3
E:nth-last-of-type(n) element E, n-is E-tüüpi element, alustades loendamist viimasest CSS3
E:first-child element E, oma vanema esimene laps CSS2
E:last-child element E, oma vanema viimane laps CSS2
E:first-of-type element E, esimene E tüüpi element CSS3
E:last-of-type element E, viimane E tüüpi element CSS3
E:only-child element E, oma vanema ainus laps CSS3
E:only-of-type element E, ainuke E tüüpi element CSS3
E:empty element E, millel pole ühtki last (ei sisalda ka teksti) CSS3
E:link hüperlingiks olev element E, mis on veel külastamata. CSS1
E:visited hüperlingiks olev element E, mis on külastatud. CSS1
E:active element E, mis on aktiveeritud kasutaja poolt (näiteks hiirekursoriga elemendi peale vajutamise ajal) CSS1
E:hover element E, mida kasutaja "kompab"? (näiteks hiirekursoriga elemendi peale olles) CSS1
E:focus element E, mis parajasti omab fookust (näiteks tekstikast, mis aktsepteerib sisendit klaviatuurilt) CSS1
E:target element E, mis dokumendile viitava URI sihtmärgiks CSS3
E:lang(fr) element E keeles "fr" CSS2
E:enabled kasutajaliidese element E, mille kasutamine on lubatud CSS3
E:disabled kasutajaliidese element E, mille kasutamine pole võimalik CSS3
E:checked kasutajaliidese element E, mis on valitud CSS3
E:indeterminate kasutajaliidese element E, mis pole valitud CSS3
E:contains("foo") element E, milles sisalduvas tekstis sisaldub alamsõne "foo" CSS3
E::first-line elemendi E, esimene renderdatud rida CSS1
E::first-letter elemendi E, esimene renderdatud täht CSS1
E::selection see osa elemendist E, mis on parajasti kasutaja poolt selekteeritud CSS3
E::before genereeritud sisu enne elementi E CSS2
E::after genereeritud sisu peale elementi E CSS2
E.foo element E, mille klass on "foo" CSS1
E#foo element E, mille ID on "foo" CSS1
E:not(s) element E, mis ei osutu valituks lihtsa selektoriga s CSS3
E F element F, mis on elemendi E järglane CSS1
E > F element F, mis on elemendi E laps CSS2
E + F element F, millele vahetult eelneb element E CSS2
E ~ F element F, millele eelneb element E CSS2

Välislingid[muuda]

Õpetused[muuda]

W3C dokumendid[muuda]