HTML5 中样式元素的“scoped”属性当前状态如何? 简介 “scoped”属性是为 HTML5 提出的,作为控制内联 中定义的 CSS 样式范围的方法。元素。然而,它的实现和支持一直是争论的焦点。 原始提案 最初,“scoped”属性旨在将样式的应用限制为 的子树元素的父元素。这允许作者在文档的特定部分使用内联样式,而不影响全局样式。 当前状态 不幸的是,作用域属性从未获得网络的广泛支持浏览器。结果,它最终被从 HTML5 规范中删除。这意味着元素现在可以放置在文档中的任何位置,但它们的样式将全局应用,就像 HTML5 之前的情况一样。</p> <p><strong>替代方法</strong></p> <p>尽管缺乏支持对于作用域属性,有其他方法可以实现作用域样式。一种常见的方法是使用 CSS 类名或 HTML 元素 ID 作为选择器来限制样式的范围。例如:</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre><code class="html"><div id="myDiv"> <style> #myDiv p { margin: 1em 0; } #myDiv em { color: #900; } Some content here... 登录后复制 在此示例中,样式仅适用于 内的元素。 ID 为“myDiv”。未来前景 目前没有计划重新引入作用域属性。然而,未来版本的 HTML 或 CSS 可能会引入不同的作用域样式方法。目前,上述替代方法为实现范围样式提供了可靠的跨浏览器解决方案。