HTML5 的'Scoped”样式属性发生了什么？

HTML5 样式的“scoped”属性之谜

在 HTML5 中，为

最初，“scoped”属性的提议旨在解决应用样式超出其预期范围的问题。在 HTML5 之前，使用

“scoped”属性旨在作为一种解决方案，表明样式应限制为元素的父级及其子树。最初，还需要作为其父级的第一个子级，为其应用程序提供清晰的边界。

但是，随着时间的推移，“范围”属性面临供应商的有限实现。考虑到这一点，当前规范承认

因此，浏览器的行为继续与 HTML5 之前一样：

当前标准和浏览器行为

鉴于当前规范和浏览器行为，显式使用 ID 实现“范围”样式仍然是最安全的方法：

<div id="myDiv">
  <style>
    #myDiv p { margin: 1em 0; }
    #myDiv em { color: #900; }
    #myDiv whatever { /* ... */ }
  </style>
  <p>Some content here...</p>
</div>

此方法可确保通过使用显式 ID 选择器仅在预期范围内应用样式。尽管缺乏官方支持的“范围”属性，但这种方法提供了合理的清晰度、验证和跨浏览器兼容性。

未来前景

截至目前，目前还没有关于“scoped”属性未来的可靠信息。然而，类似的范围样式技术（例如使用自定义元素或 Web 组件）正在变得越来越重要。这些技术为网页内的样式应用提供了更大的灵活性和更精细的控制。

总之，

以上是HTML5 的'Scoped”样式属性发生了什么？的详细内容。更多信息请关注PHP中文网其他相关文章！