HTML atribut scoped
HTML 5.1 přichází s možností validně používat element <style>
i mimo část <head>
.
Tedy používat jej tam, kde to odjakživa také funguje, tj. kdekoliv ve stránce. Aby to nebylo tak jednoduché, podle návrhu jsou ohledně <style>
dva způsoby použití:
- normálně v hlavičce (jako doposud),
- kdekoliv ve stránce právě s atributem
scoped
Atribut scoped
je boolean.
Podpora
Atribut scoped
funguje od Firefoxu 21. Na okamžik se objevil i ve Chrome (po zapnutí experimentálních vlastností), ale v Chrome 37 už tato možnost byla vyřazena.
- Vývojáři jádra Blink (používá Chrome a Opera 15+): Intent to remove <style scoped>
Využití
V podporovaných prohlížečích <style scoped>
zajistí aplikaci daného CSS jen v rámci svého rodiče (na příkladu element <div>
). Deklarace p {color: red}
proto nepřebarví všechny všechny odstavce na stránce, ale jen ten v daném scope (prostoru ohraničeného nejbližším nadřazeným elementem – s pojmem scope se je možné setkat i v JavaScriptu nebo jiných programovacích jazycích).
<head>
<style>
p {color: blue}
</style>
</head>
<body>
<p>Modrý odstavec</p>
<div>
<style scoped>
p {color: red}
</style>
<p>Červený odstavec</p>
</div>
</body>
Zatím se ale nabízí spíš využití ve formě umlčení HTML 5 validátoru při používání <style>
v těle dokumentu. Je zde ale risiko, že prohlížeče začnou scoped
podporovat. A takto zapsaný styl začne fungovat jinak, než bylo očekáváno.
Komentáře