HTML5中样式元素的“作用域”属性的当前状态是什么？

它在这里说 http://www.w3.org/TR/html-markup/style.html#style：

Permitted parent elements

any element that can contain Metadata elements,div,noscript,
section,article,aside

那个< style>或多或少允许每个地方(其中< div>被允许)
但另一方面，我在这里找到了更详细的信息http://www.w3.org/TR/2012/WD-html5-20121025/the-style-element.html#attr-style-scoped

Contexts in which this element can be used: (annotation: style)

06000

并在本文后面：

The scoped attribute is a boolean attribute. If present,it indicates
that the styles are intended just for the subtree rooted at the style
element’s parent element,as opposed to the whole Document.

If the scoped attribute is present and the element has a parent
element,then the style element must be the first node of flow content
in its parent element other than inter-element whitespace,and the
parent element’s content model must not have a transparent component.

这看起来像是(或将会)“两个不同的< style>元素”：a

>< style> – 全局 – ~~仅在< head>内
><“scopestyle”> – 只有(！)与bool范围attr和~~只在开始< div>

(pls。读“~~”喜欢“或多或少”)

但是后来的链接已经超过2年了，所有的浏览器(我测试过Chrome，FF，IE，Opera)解释了流入< style>好像它在标题中。 (并忽略AFAIK的范围 – 是 – 仍然没有标准)

所以我的3部分问题

>我对W3C文档(2种风格 – 逻辑)的解释是否正确？
>现在的状态是什么 – 2015？
>而且，有可能有人在那里，谁知道在地平线上呢？

解决方法

您对规范的解释显示正确。 MDN page on the style tag包括对范围属性的描述。

scoped If this attribute is present,then the style applies only to its parent element. If absent,the style applies to the whole document.

范围属性：

这是一个可以在Firefox 21中工作的工作示例。

例：

<div>
  <p>Out of scope.</p>
  <div>
    <style scoped>
      p {
        background: green;
      }
    </style>
    <p>In scope (green background).</p>
  </div>
  <p>Out of scope.</p>
</div>

在不支持范围属性的浏览器中，这些样式全局应用。

The：范围伪选择器：

除了范围属性之外，还有可以使用的the :scope pseudo-selector。该实现提供与之前相同的支持。

例：

<div>
  <p>Outside scope.</p>
  <div>
    <style scoped>
      :scope p {
        background: green;
      }
    </style>
    <p>In scope (green background).</p>
  </div>
  <p>Outside scope.</p>
</div>

此选项还增加了如果浏览器不了解作用域属性的风格，则不会在全局应用样式。唯一的问题是，Safari 7将会识别：范围伪选择器，即使不支持范围属性，因此Safari 7中的优点将会丢失。

全球风格：

如前所述，使用没有作用域属性的样式标签将创建全局样式，因此如果包含作用域属性，它将仅作为范围。

兼容性摘要：

在这一点上，对该功能的支持看起来很暗淡。 CSS范围仅在Firefox 21中受支持。 Chrome，Internet Explorer，Safari或Opera目前不支持此功能。 According to caniuse.com，从Chrome 20到36，可以启用支持与实验标志，但support was removed。

原文地址：https://www.jb51.cc/html5/168928.html