Wie bauen Verbindung Styles in Cascading Style Sheets (CSS)

Nachdem Sie mit benutzerdefinierten Klasse, Tag neu definiert beherrschen zu arbeiten, und ID Stile in Cascading Style Sheets (CSS), können Sie den großen Ligen der Verbindung Stile Schritt in. Um zu verstehen, wie man mit Verbindung Stile zu arbeiten, müssen Sie zunächst ein Verständnis von HTML / CSS-Dokument Bäume haben, die die Beziehungen zwischen den Objekten innerhalb des Dokuments definieren.

So wie der Mensch einen Stammbaum, das Dokument und die Objekte darin haben können durch ihre Beziehungen definiert werden. Dies bedeutet, dass Sie die Objekte in Ihren Dokumenten durch ihre Beziehung zu anderen Objekten zu identifizieren. Jedes Objekt kann haben Vorfahren, Nachkommen, Eltern, Kinder und Geschwister.

Zum Beispiel kann die Fußzeile (Unterer Teil) einer Web-Seite könnte eine ungeordnete Liste der verlinkten Text enthalten. In diesem Szenario ist der übergeordnete Container für die Liste der Fußzeile, und die einzelnen Listenelemente sind Geschwister. Wenn darüber hinaus die Fußzeile das Kind der Tag ist, kann die Platzierung dieser Liste innerhalb des Dokumentenbaum wie folgt aussehen:

Compound-Stile sind, wo ein großer Teil der Beinarbeit in CSS geschieht, weil Selektoren können in einer Vielzahl von Möglichkeiten beschrieben werden, einschließlich der folgenden beliebtesten Verwendungen:
  • Pseudo-Klassen: Eine Pseudo-Klasse als eine besondere Art von Selektor, die Sie Formatelemente können, die nicht im Dokumentbaum, wie Hyperlink Staaten, erste und letzte Kind-Elemente sind, und aktive Elemente. Mit anderen Worten, sie sind für die tatsächlichen Elemente nicht verwendet, sondern konzeptionelle Elemente, wie jede andere Zeile in einer Tabelle. Die häufigste Verwendung ist Stile für Hyperlinks zu erstellen.
    •  
  • Mehrere Selektoren: Verwendet die gleichen Stile auf mehrere Tags anwenden, wird der Selektor nicht durch Komma unterteilt, entweder mit oder ohne Leerzeichen, wie in Körper, th, td {# 133-} oder Körper, th, td {# 133-}.
    •  
  • Nachfahrenselektoren: Auch genannt erweiterte combinators, Sie können diese Selektoren ganz bestimmte Elemente auf Ihrer Seite, wie Nachkommen eines anderen Elements im Dokumentbaum zu gestalten.
    Zum Beispiel, anstatt einen Tag neu definieren Stil für alle Listenelemente in Ihrer Website erstellen, können Sie alle Listenelemente in einer geordneten Liste in der Seitenleiste des Layouts mit einem Wahl Ziel mit dem Namen #sidebar ol li. Diese Stile können geschrieben werden, um jede Kombination von Tags enthalten, Tag neu definiert, ID Stile und benutzerdefinierte Klassennamen.
 
  
 
Ähnliche
 
 
 
 
Menü