Heim >Web-Frontend >H5-Tutorial >Beispiele für die Verwendung des Scoped-Attributs in HTML5_html5-Tutorial-Tipps

Beispiele für die Verwendung des Scoped-Attributs in HTML5_html5-Tutorial-Tipps

WBOY
WBOYOriginal
2016-05-16 15:47:551347Durchsuche

Insbesondere gibt es ein neues Attribut, mit dem wir die Attribute mehrerer Elemente steuern können: Gültigkeitsbereich. Das neue Bereichsattribut, das im Stil-Tag angezeigt wird, kann dazu führen, dass der CSS-Stil nur auf lokale Elemente wirksam wird. Der einzige Unterschied zum normalen Stil besteht darin, dass er auf die Unterelemente des Elements wirkt Ein neues bereichsbezogenes Attribut wird hinzugefügt:

Code kopieren
Der Code lautet wie folgt:


Stile mit dem Attribut „scoped“ werden nur auf das aktuelle Element und seine untergeordneten Elemente angewendet. Inline-Stile haben immer noch eine höhere Priorität als bereichsbezogene Stile, daher ist es am besten, die Verwendung von Inline-Stilen zu vermeiden, um ihren Effizienzbereich zu vergleichen:

Code kopieren
Der Code lautet wie folgt:






Dieses neue bereichsbezogene Attribut ist eine sehr nützliche Funktion, insbesondere für diejenigen, die Vorlagen erstellen, oder CMS-Benutzer oder einige Entwickler, die nicht die gesamte Stildatei bedienen können. Es ist jedoch zu beachten, dass einige alte Browser dieses Attribut nicht unterstützen. In diesem Fall müssen Sie möglicherweise das jQuery-Plugin verwenden (
https://github.com/thingsinjars/jQuery-Scoped-CSS-plugin ), um dieses Problem zu beheben.

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