Beliebte Beiträge Auf Dem Pc Und Software

Top Artikel Auf Internet - 2018

CSS-Selektoren - Was ist ein CSS-Selektor?

CSS verwendet Mustervergleichsregeln, um festzulegen, welcher Stil für welches Element im Dokument gilt. Diese Muster werden Selektoren genannt und reichen von Tag-Namen (z. B. p bis Paragraf-Tags) bis zu sehr komplizierten Mustern, die mit sehr spezifischen Teilen eines Dokuments übereinstimmen (z. B. p # myid> b.highlight würde jedes b -Tag mit einer Klasse von highlight entsprechen, die ein untergeordnetes Element des Absatzes mit der ID myid ist ).

Ein CSS-Selektor ist der Teil eines CSS-Stilaufrufs, der angibt, welcher Teil der Webseite gestylt werden soll. Der Selektor enthält eine oder mehrere Eigenschaften, die definieren, wie der ausgewählte HTML-Stil gestaltet wird.

Die CSS-Selektoren

Es gibt verschiedene Selektortypen:

  • Typselektoren, die einem bestimmten Element entsprechen
  • Klassenselektoren- Übereinstimmende Elemente mit einer bestimmten Klasse
  • ID-Selektoren, die dem Element mit einer bestimmten ID entsprechen
  • untergeordnete Selektoren - übereinstimmende Elemente, die Nachkommen eines bestimmten Elements sind
  • untergeordnete Selektoren, die untergeordnete Elemente des spezifischen Elements sind
  • universelle Selektoren - Übereinstimmung mit einem beliebigen Element
  • benachbarten Geschwisterselektoren - übereinstimmenden Elementen, denen unmittelbar ein spezifisches Element vorausgeht
  • Attributauswahlelemente, die mit einem bestimmten Attribut oder Attributwert übereinstimmen
  • Pseudoklassenselektoren-übereinstimmende Elemente mit eine bestimmte Pseudoklasse
  • Pseudo-Element-Selektoren-passende Elemente mit spezifischen Pseudo-Element-Eigenschaften

    CSS-Styles und CSS-Selektoren formatieren

    Das Format eines CSS-Styles sieht folgendermaßen aus:

    select oder {style Eigenschaft: Stil; }

    Trennen Sie mehrere Selektoren mit demselben Stil durch Kommas. Dies wird Selektorgruppierung genannt. Zum Beispiel:

    selector1 , selector2 {style property: style; }

    Gruppierungsselektoren sind ein Kurzschreibmechanismus, mit dem Sie Ihre CSS-Stile kompakt halten können.

    Die obige Gruppierung hätte den gleichen Effekt wie:

    selector1 {style property: style; }
    selector2 {Stil Eigenschaft: Stil; }

    Immer Ihre CSS-Selektoren testen

    Nicht alle Browser unterstützen alle CSS-Selektoren. Stellen Sie sicher, dass Sie Ihre Selektoren in so vielen Browsern wie möglich auf vielen Betriebssystemen testen. Aber wenn Sie CSS 1 oder CSS2 Selektoren verwenden, sollten Sie in Ordnung sein.

    Senden Sie Ihren Kommentar