CSS-Selektoren
CSS-Selektoren werden verwendet, um die Elemente auszuwählen, die Sie Stil Muster möchten.
"CSS" Spalte zeigt an, in dem CSS-Eigenschaften definiert (CSS1, CSS2, oder CSS3).
| Wähler | Beispiel | Beispiel zeigt, | CSS |
|---|---|---|---|
| . Klasse | .intro | Wählen Sie alle class = "intro" Element | 1 |
| # Id | #firstname | Wählen Sie alle id = "Vorname" Elemente | 1 |
| * | * | Wählen Sie alle Elemente | 2 |
| Element | p | Wählen Sie alle <p> Elemente | 1 |
| Element, Element | div,p | Wählen Sie alle <div> Element und das Element <p> | 1 |
| Element Element | div p | Wählen Sie <div> alle <p> Elemente innerhalb des Elements | 1 |
| Element> -Element | div>p | Wählen Sie alle Eltern ist ein <div> Element des Element <p> | 2 |
| Element + Element | div+p | Wählen Sie <p> Element, gefolgt von allen <div> Elemente nach | 2 |
| [Attribut] | [target] | Wählen Sie alle Elemente mit dem Zielattribut | 2 |
| [Attribut = Wert] | [target=-blank] | Alles auswählen Verwendung target = - Element "blank" von | 2 |
| [Attribut ~ = value] | [title~=flower] | Wählen Sie alle Elemente des Titel Attribut enthält das Wort "Blume" von | 2 |
| [Attribut | = Sprache] | [lang|=en] | Wählen Sie alle Elemente eines lang Attributwert start = "EN" von | 2 |
| : link | a:link | Wählen Sie alle nicht besuchte Links | 1 |
| : visited | a:visited | Wählen Sie alle besuchten Links | 1 |
| : aktiv | a:active | Wählen Sie den aktiven Link | 1 |
| : Hover | a:hover | Wenn Sie wählen Sie die Maus auf den Link oben | 1 |
| : Fokus | input:focus | Fokus Wählen Sie das Eingangselement | 2 |
| : First-letter | p:first-letter | Wählen Sie den ersten Buchstaben jedes Element <p> | 1 |
| : First-line | p:first-line | Wählen Sie die einzelnen <P> Die erste Zeile Element | 1 |
| : First-child | p:first-child | Spezifizierte nur, wenn <p> Element ist das erste Kind seiner Eltern Stil. | 2 |
| : vor | p:before | Legen Sie Inhalt vor jedem Element <p> | 2 |
| : nach | p:after | Inhalt einfügen nach jedem Element <p> | 2 |
| : Lang (Sprache) | p:lang(it) | Wählen Sie ein lang Startwert Attribut = "es" alle <p> Elemente | 2 |
| element1 ~ element2 | p ~ ul | Jede Wahl p ul-Element nach Element | 3 |
| [Attribut ^ = value] | a [src ^ = "https"] | Wählen Sie jedes Attribut src Wert auf "https" am Anfang des Elements | 3 |
| [Attribut $ = Wert] | a [src = $ ". pdf"] | Wählen Sie jedes Attribut src Wert auf ".pdf" am Ende des Elements | 3 |
| [Attribut * = value] | a [src * = "w3big"] | Wählen Sie jedes Element src-Attribut-Wert enthält die Teil "w3big" von | 3 |
| : First-of-Art | p: first-of-Art | jedes p p Element Wählen Sie das erste Element des übergeordneten | 3 |
| : Last-of-Art | p: last-of-Art | jedes Element p Wählen Sie das letzte Element des übergeordneten p | 3 |
| : Nur-of-Art | p: nur-of-Art | jedes Element p Wählen Sie ist das einzige Element des übergeordneten p | 3 |
| : Nur-Kind | p: Nur-Kind | jedes Element p Wählen Sie ist das einzige Kind-Element des übergeordneten | 3 |
| : N - te-Kind (n) | p: n-ter Kind (2) | jedes Element p Wählen Sie ist das zweite Kind seiner Eltern | 3 |
| : N - te-last-Kind (n ) | p: n-te-last-Kind (2) | jedes Element p Wählen Sie ist das zweite Kind seiner Eltern, aus dem letzten Kind zu zählen | 3 |
| : Nth-of-Typ (n ) | p: nth-of-Typ (2) | jedes Element p Wählen Sie ist die zweite p-Element des übergeordneten | 3 |
| : N - te-last-of-Typ (n) | p: n-te-last-of-Typ (2) | jedes Element p Wählen Sie ist die zweite p Element seiner Eltern, aus dem letzten Kind zu zählen | 3 |
| : Last-child | p: last-child | jedes Element p Wählen Sie das letzte Kind seiner Eltern. | 3 |
| : root | : Root | Wählen Sie das Stammelement des Dokuments | 3 |
| : leer | p: empty | Wählen Sie jedes der p-Element keine Kinder hat (einschließlich Textknoten) | 3 |
| : Ziel | #news: Ziel | Wählen Sie die aktuell aktiven #news Element (einschließlich der Ankernamen klickbare URL) | 3 |
| : aktiviert | Eingabe: aktiviert | Wählen Sie die einzelnen Eingabeelement aktiviert | 3 |
| : Behinderte | Eingang: Behinderte | Auswählen jedes Eingabeelement deaktiviert | 3 |
| ausgewählt | Eingang: geprüft | Wählen Sie jedes ausgewählte Eingabeelement | 3 |
| : Nicht (Selector) | : Nicht (p) | jedes Element Wählen Sie nicht p-Elemente | 3 |
| :: Auswahl | :: Auswahl | Element wird in dem Zustand des Benutzers teilweise Übereinstimmung ausgewählt oder hervorgehoben | 3 |
| : Out-of-Range | : Out-of-Range | Matching Werteingabeelement außerhalb des angegebenen Bereichs | 3 |
| : In-Bereich | : In-Bereich | Passende Werteingabeelement innerhalb des angegebenen Bereichs von der | 3 |
| : Read-write | Lesen-Schreiben: | Es verwendet, um lesbar und beschreibbar Element entsprechen | 3 |
| read-only: | Read only-: | Für passende Set "nur lesbar" (read-only) Attributelement | 3 |
| : optional | : Optional | Für die optionale Eingabeelement passend | 3 |
| : erforderlich | : Erforderlich | Richten Sie auf das Element gefunden, die "erforderlich" Eigenschaft | 3 |
| : gültig | : Gültig | Verwendet, um den Eingangswert zu entsprechen ist ein legitimes Element | 3 |
| : ungültige | : Ungültige | Unzulässiger Wert für die Eingangselement Streichhölzer | 3 |