Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Wie ist die Reihenfolge der CSS-Codierung? Detaillierte Erläuterung der CSS-Codierungsreihenfolge

云罗郡主
Freigeben: 2018-11-23 16:51:39
Original
2339 Leute haben es durchsucht

In diesem Artikel erfahren Sie, in welcher Reihenfolge die CSS-Codierung erfolgt. Die detaillierte Erklärung der CSS-Codierungssequenz hat einen gewissen Referenzwert. Freunde in Not können darauf zurückgreifen.

Wie ist die Reihenfolge der CSS-Codierung? Detaillierte Erläuterung der CSS-Codierungsreihenfolge

CSS-Codierungsreihenfolge-Recherche Der zuletzt definierte CSS-Stil überschreibt alle vorhandenen oder widersprüchlichen Stile, die zuvor definiert wurden, wie zum Beispiel das folgende Beispiel:

Beispielcode

p { color: red; background: yellow }
p { color: green }
Nach dem Login kopieren

Der obige Absatz wird schließlich in grüner Schrift mit gelbem Hintergrund angezeigt. Dies liegt daran, dass die zuletzt definierte Farbe: Grün die zuvor definierte Farbe überschreibt. Was Gelb betrifft, liegt der Grund dafür, dass kein Konflikt vorliegt Definition in der zweiten Definition von p, daher ist sie weiterhin gültig.

Verstehst du das wirklich? Okay, machen wir einen kleinen Test:

Beispielcode

p.red { color: red }
p.green { color: green }
p.blue { color: blue }
Nach dem Login kopieren

Beispielcode

<p class="red green blue">http://www.php.cn/</p>
<p class="green blue red">http://www.php.cn/</p>
<p class="blue red green">http://www.php.cn/</p>
Nach dem Login kopieren

Entschuldigung, wenn er endlich angezeigt wird, wird der Text in den obigen drei Absätzen so aussehen angezeigt Welche Farbe?

Die Antwort ist, dass sie alle in Blau angezeigt werden, d Beispielsweise wird der erste Stil als blau, der zweite als rot und der dritte als grün angezeigt. Dies hat jedoch nichts mit der Reihenfolge zu tun, in der die Stile angezeigt werden Sie alle folgen letztendlich dem zuletzt angegebenen Stil und die Farbe ist blau.

Wie ist oben die Reihenfolge der CSS-Codierung? Eine vollständige Einführung zur detaillierten Erläuterung der CSS-Codierungsreihenfolge. Wenn Sie mehr über das CSS3-Tutorial erfahren möchten, schauen Sie sich bitte die chinesische PHP-Website an.


Das obige ist der detaillierte Inhalt vonWie ist die Reihenfolge der CSS-Codierung? Detaillierte Erläuterung der CSS-Codierungsreihenfolge. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage