CSS (Cascading Style Sheets) wird verwendet, um die Darstellungsform von HTML-Dokumenten festzulegen. Alles hat eine Reihenfolge, alles hat einen Dienstalter. Unter normalen Umständen sind keine Unterschiede erkennbar, was die sogenannte Gleichheit aller Lebewesen darstellt. Wenn jedoch Konflikte und Verstrickungen auftreten, ist es offensichtlich, dass eine vollständige Gleichwertigkeit nicht erreicht werden kann und die Identitätsunterschiede in der richtigen Reihenfolge auftreten. Kaskadierung ist der Prozess, bei dem der Browser mehrere Stilquellen stapelt und letztendlich das Ergebnis bestimmt. In diesem Artikel geht es um die spezifische Rolle von CSS-Kaskadenstilen.
Zuallererst können Sie kostenlose Kurse im Zusammenhang mit PHP-Chinesisch-Websites lernen
1. Lernen Sie HTML+CSS unter Ihre Fingerspitzen"CSS-KaskadierungTutorial
CSS-Kaskadierungsstil
1.
Vererbung und Kaskadierung im CSS-Stil
Funktionen: Der
Tag-Selektor wählt alle angegebenen Tags auf der aktuellen Seite aus; tag Der Selektor hat keinen Bezug zur aktuellen Tag-Hierarchie des Codes und kann ausgewählt werden, solange er sich auf der aktuellen Seite befindet. 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 der Beschriftung einen Klassennamen und wählen Sie die angegebene Beschriftung über die Klassenauswahl aus.
2. Detaillierte Erläuterung des CSS-Kaskadierungsmechanismus
Kaskadierung in kaskadierenden Stylesheets bedeutet, dass Stile von einer Ebene zur anderen in der Dokumentstruktur weitergegeben werden Die Funktion besteht darin, den Browser aus vielen Quellen entscheiden zu lassen, welche Quellstilattribute auf ein bestimmtes Tag angewendet werden sollen.
Kaskadierung ist ein mächtiger Mechanismus. Das Verständnis von Kaskaden kann Ihnen dabei helfen, CSS auf die wirtschaftlichste und wartbarste Art und Weise zu schreiben und das ideale Erscheinungsbild des Dokuments zu erstellen, das Sie sich wünschen.
3.
Detaillierte Erläuterung der CSS-Vererbung und Kaskadierungsfunktionen
Das erste P verwendet keinen Selektor, daher wird die Standardanzeigefarbe von HTML (schwarz) verwendet
Das zweite P verwendet den Klassenselektor, daher wird die Farbe des Klassenselektors (rot) bevorzugt
Das dritte P verwendet sowohl ID- als auch Klassenselektoren, da die Priorität des ID-Selektors höher ist als der Klassenselektor, daher wird die Farbe in Blau angezeigt
Das vierte P verwendet einen Inline-Selektor und einen ID-Selektor. Da der Inline-Selektor eine höhere Priorität hat als der ID-Selektor, wird die Farbe in Gelb angezeigt
Das fünfte P verwendet gleichzeitig zwei Klassenselektoren. Der Browser verwendet bei der Interpretation der Webseite die durch den ersten Klassenselektor definierte Farbe, daher ist die Farbe lila
Das sechste persönliche P verwendet zwei ID-Selektoren gleichzeitig, da der ID-Selektor jedoch nur für einen Tag gleichzeitig verwendet werden kann und global eindeutig ist, betrachtet der Browser dies als illegal und die Farbe wird mit seinem Standardwert (schwarz)
4.
Detaillierte Beschreibung des CSS-Cascading-Stylesheets
[Attribut] Wählen Sie Elemente mit Attributattributen aus. [attribute=value] wählt Elemente mit Attribut attribute und Attribut value gleich value aus.
[Attribut~=Wert] Wählt ein Element aus, das ein Attributattribut hat und der Attributwert eine durch Leerzeichen getrennte Liste von Wörtern ist, von denen eines gleich dem Wert ist.
[attribute|=value] wählt E-Elemente aus, die das att-Attribut haben und deren Attributwert eine Zeichenfolge ist, die mit val beginnt und durch den Konnektor „-“ getrennt ist.
[attibute^=value] stimmt mit E-Elementen mit dem Attribut attribute überein, deren Wert mit dem Wert
[attribute$=value] mit dem Attribut attribute beginnt und deren Wert mit dem Wert
[attribute*=value] gleicht E-Elemente mit Attributattributen und Werten ab, die einen Wert enthalten
5
CSS-Stylesheets, Vererbung, Kaskadierung und Attributwerte analysieren
CSS verfügt über Eigenschaften, die die grundlegende Formatierung steuern (z. B. Schriftgröße und Farbe usw.), Eigenschaften, die das Layout steuern (z. B. Position und Gleitkomma usw.) und außerdem bestimmt, wo Besucher beim Drucken die Seiten wechseln Bedienelemente. Darüber hinaus gibt es viele weitere Attribute.
Das Stylesheet enthält die Regeln, die das Erscheinungsbild der Webseite definieren. Jede Regel besteht aus zwei Hauptteilen: dem Selektor (Auswahl) und dem Deklarationsblock (Deklaration). Selektoren bestimmen, welche Elemente betroffen sind, und Deklarationsblöcke bestehen aus einem oder mehreren Attribut-Wert-Paaren, die angeben, was getan werden soll. 6.
CSS-Spezifität, Vererbung und Kaskadierung
Die mit !important gekennzeichnete Aussage wird als wichtige Aussage bezeichnet. Sie hat keine Besonderheit, muss aber mit der nicht verglichen werden -wichtige Aussage. Betrachten Sie sie separat.
Konkret: Unwichtige Aussagen werden in einer Gruppe zusammengefasst, und Konflikte zwischen ihnen werden anhand von Besonderheiten gelöst; wichtige Aussagen werden in einer Gruppe zusammengefasst, und Konflikte zwischen ihnen werden intern immer vorrangig vor unwichtigen Aussagen gelöst .
Verwandte Fragen und Antworten
1. Wie kann ein Element ohne kaskadierenden Kontext einen größeren Z-Index haben als ein Element mit eins?
2.
iOS Webview lädt HTML-Dateien, kein Problem unter 9.2, aber unter 8.1 erscheint unten eine horizontale Layoutkaskadierung
[Verwandte Empfehlungen]
1. Kostenlose Video-Tutorials auf der chinesischen PHP-Website:
„php.cn Dugu Jiujian (2) – CSS-Video-Tutorial“
2. Verwandte Artikel auf der chinesischen PHP-Website :
CSS überlappende DIV-Beispielzusammenfassung
Das obige ist der detaillierte Inhalt vonZusammenfassung verschiedener Beispiele für kaskadierende Stile in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
