Heim >Web-Frontend >HTML-Tutorial >Ungültige Lösung, wenn mehrere Klassenattribute in der HTML_HTML/Xhtml_Web-Seitenproduktion definiert sind

Ungültige Lösung, wenn mehrere Klassenattribute in der HTML_HTML/Xhtml_Web-Seitenproduktion definiert sind

WBOY
WBOYOriginal
2016-05-16 16:39:022362Durchsuche

Beim Schreiben von HTML definieren wir häufig mehrere Werte für das Klassenattribut, stellen jedoch auch häufig fest, dass die von uns definierten Werte ungültig sind! ! !

Wenn ich in der Vergangenheit auf diese Situation gestoßen bin, habe ich sie direkt umgeschrieben oder die ID direkt verwendet, um das CSS-Attribut festzulegen. Aber heute denke ich darüber nach, dass etwas nicht stimmt. . . Ich muss die Wahrheit finden! ! !

Code kopieren
Der Code lautet wie folgt:





Ich bin in zwei Klassen. Die in middle_div eingestellte Farbe ist rot und die in padding_10 festgelegte Farbe ist grün. Das gab mir das erste Gefühl Richtung ist umgekehrt!

Also habe ich die beiden Positionen vertauscht und es war immer noch grün! !

Dies. . . .

Könnte es sein? ? ?

Öffnen Sie die CSS-Datei und schauen Sie nach, padding_10 steht vor middle_div.

Aktualisiert den Browser. ! !

Wenn Sie also mehrere Klassenwerte definieren, stellen Sie sicher, dass Sie Ihren Lieblingsstil am Ende angeben!
Aber wenn Sie ein div vor padding_10 hinzufügen (vorausgesetzt, das übergeordnete Element ist ein div) und es zu div.padding_10 wird, werden Sie feststellen, dass unser p div immer grün ist, egal wo es ist,

Wie aus diesem Beispiel ersichtlich ist, wird die Priorität des CSS-Stils beim Laden der CSS-Datei bestimmt und nicht später durch die Position des Klassenattributs im HTML bestimmt.
Stellungnahme:
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