Analyse der Vererbung und Kaskadierung von CSS-Stilen

In diesem Artikel werden hauptsächlich relevante Informationen zur Vererbung und Kaskadierung von CSS-Stilen vorgestellt

1: Basic Selector

Tag-Auswahl: Wählen Sie entsprechend dem Tag-Namen auf der Seite aus und wenden Sie den Stil direkt auf das angegebene Tag an.

Funktionen:

1. Der Tag-Selektor wählt alle angegebenen Tags auf der aktuellen Seite aus Es besteht keine Verbindung zur aktuellen Tag-Hierarchie. Solange es sich auf der aktuellen Seite befindet, kann es ausgewählt werden.

ID-Auswahl: Sie müssen zuerst ein Tag angeben, um den ID-Wert festzulegen (der ID-Wert kann nicht wiederholt werden und ist auf der gesamten Seite eindeutig).

Klassenauswahl: Geben Sie dem Etikett einen Klassennamen und wählen Sie das angegebene Etikett über die Klassenauswahl aus.

2: Drei Sätze komplexer Selektoren

1. Sie kann nachfolgende Unter-Tags

B basierend auf den Tags in der aktuellen Auswahl finden. Der Nachkommen-Selektor kann eine mehrstufige präzise Auswahl durchführen

2. Schnittpunkt-Selektor

Format: Auswahl der ersten Ebene, Auswahl der zweiten Ebene {}

Hinweis: Punkte stellen Schnittpunkte dar, die normalerweise mit einer Beschriftung beginnen

3. Union-Selektor

Format: erster Selektor, zweiter Selektor,...{}

Drei: CSS-Vererbung

Definition: Es gibt einige Stile . Beim Festlegen des aktuellen Tags werden auch seine Nachkommen-Tags festgelegt Hinweis: Die vom Stil geerbten Tags und die Tags, die den Stil definieren, müssen untergeordnet sein (Nachkommen-Tag-Beziehung) Ja Nur die grundlegenden Attribute von Text Stileinstellungen können vererbt werden (Farbe Farbe Stil Text Schriftart Schriftart Zeile Attribut Zeile) Alle Attributeinstellungen (Rahmen, Positionierung, Layout) für das Box-Modell (p, span usw.) können nicht vererbt werden

Viertens: CSS-Kaskadierung

Definition: Wenn mehrere Selektoren gleichzeitig auf dasselbe Tag einwirken, werden sie entsprechend der Prioritätsstufe Funktion gestaltet Beurteilungsmethode des Selektors:

-nach Gewicht-Beurteilungsmethode

-nach der Anzahl der ID-Auswahl, Klassenauswahl und Tag-Auswahl in jeder Auswahl. Um das Gewicht zu berechnen (ICE ) -Vergleichen Sie zuerst das ID-Gewicht, dann vergleichen Sie die Klasse und schließlich das Etikett-Die Vergleichsreihenfolge ist für alle gleich

Hinweis: Wenn die Gewichte gleich sind, gilt das spätere diejenigen werden die vorherigen überschreiben. Die Prämisse der numerischen Gewichtung besteht darin, sicherzustellen, dass jeder Selektor das angegebene Element auswählen muss.

Wenn sich der Geltungsbereich nicht direkt auf die Beschriftung selbst auswirkt, spiegelt er das Proximitätsprinzip wider

wichtig hat die höchste Priorität und * hat die niedrigste Priorität

Das obige ist der detaillierte Inhalt vonAnalyse der Vererbung und Kaskadierung von CSS-Stilen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!