Heim  >  Artikel  >  Web-Frontend  >  So vermeiden Sie Unterstreichungen beim Benennen von CSS-Layouts

So vermeiden Sie Unterstreichungen beim Benennen von CSS-Layouts

云罗郡主
云罗郡主Original
2018-11-26 16:18:052553Durchsuche

Der Inhalt dieses Artikels befasst sich mit dem Versuch, Unterstreichungen bei der Benennung von CSS-Layouts zu vermeiden. Ich hoffe, dass er für Sie hilfreich ist.

So vermeiden Sie Unterstreichungen beim Benennen von CSS-Layouts

Freunde, die CSS-Hacks verwendet haben, sollten wissen, dass die Benennung mit Unterstrichen auch ein Hack ist. Die Verwendung von Namen wie „_style“ kann beispielsweise dazu führen, dass die meisten Browser außerhalb des IE funktionieren Dieser Stil wird ignoriert, daher ist die Verwendung von „_“ als Trennzeichen bei der Benennung unregelmäßig. Bei der CSS-Überprüfung wird eine Fehlermeldung angezeigt. Vermeiden Sie daher die Verwendung von Unterstrichen in Namen.

Zu diesem Zweck müssen Sie ein Standardsymbol finden, das den Unterstrich ersetzen kann. Natürlich müssen Sie diese Art von Trennzeichen nicht verwenden, es ist nur eine Frage der persönlichen Gewohnheiten.

Ich habe einen kleinen Test gemacht und die Unterstriche durch „~“, „$“, „`“, „&“ und „-“ ersetzt. Daher kann nur das „-“-Zeichen verwendet werden. Und die Unterstützung für js ist auch normal. Schauen Sie sich den Test an:

Das Folgende ist der zitierte Inhalt:

CSS-Teil:

Der Code lautet wie folgt:

.try-a{ color:#00f; }
.try~a{ color:#00f; }
.try`a{ color:#00f; }
.try&a{ color:#00f; }
.try$a{ color:#00f; }
.try-b{ color:#f00; }
.try~b{ color:#f00; }
.try`b{ color:#f00; }
.try&b{ color:#f00; }
.try$b{ color:#f00; }

html-Teil:

Der Code lautet wie folgt:

<div id="a" class="try-a">try1</div>
<div id="b" class="try~a">try2</div>
<div id="c" class="try`a">try3</div>
<div id="d" class="try&a">try4</div>
<div id="e" class="try$a">try5</div></p> <p><input type="button" value="ok" onclick="b();" />

js-Teil:

Der Code lautet wie folgt:

function b(){
document.getelementbyid("a")。classname="try-b";
document.getelementbyid("b")。classname="try~b";
document.getelementbyid("c")。classname="try`b";
document.getelementbyid("d")。classname="try&b";
document.getelementbyid("e")。classname="try$b";
}

Das Ergebnis ist, dass „try1“ rot wird und die Anzeige normal ist. In der CSS-Definition wird jedoch häufig der ID-Selektor verwendet, wenn bei der ID-Bezeichnung auf der Seite zwangsläufig die Unterstreichung „_“ im CSS-Stil angezeigt wird. Daher müssen Sie hier auf die ID achten . Vermeiden Sie außerdem die Verwendung von Unterstrichen bei der Benennung.

Oben geht es darum, Unterstreichungen bei der Benennung von CSS-Layouts zu vermeiden. 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 vonSo vermeiden Sie Unterstreichungen beim Benennen von CSS-Layouts. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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