-2

我一直认为你不能向元素添加内联样式,但是不久前:hover{..}我遇到了这个页面,在那里我看到了这样的东西。

<a href="http://www.w3.org/"
          style="{color: #900}
          :link {background: #ff0}
          :visited {background: #fff}
          :hover {outline: thin red solid}
          :active {background: #00f}">...</a>

我根本不喜欢内联样式,但我当前的应用程序是基于内联样式/脚本的,所以这对我来说是一个很棒的功能。

有一个问题:它不起作用

有谁知道为什么这不起作用?Chrome 没有实现它还是什么?

演示

来自w3.org的演示代码

4

1 回答 1

9

事实上,这里的另一个问题引用了相同的文件。这就是我不得不说的:

您链接到的那个文件是10 年前的草稿

现在它已经 11 岁了,但这不是重点(尽管它确实暗示了您给出的示例不起作用的一个很可能的原因)。关键是给出的例子没有出现在同一规范的最新版本中。因此,据推测,在样式属性中嵌入选择器被认为是不可行的,因此被丢弃。

对评论中链接的问题的回答表明,为什么认为这样的功能不可行——它与 CSS 作为一种语言的当前状态根本不兼容:

请注意,内联样式与规则集中的选择器参与相同的级联,并且在级联中具有最高优先级(!important尽管如此)。因此它们甚至优先于伪类状态。在内联样式中允许伪类或任何其他选择器可能会引入一个新的级联级别,并随之带来一组新的复杂性。

当然,我并没有声称代表实际做出决定和/或编写规范的人发言,但如果我是他们中的一员,这就是我不支持该功能的原因。

这也可以解释为什么没有浏览器实现这样的功能(或者,更可能的是,缺乏实现是导致它被重新考虑然后最终放弃的因素之一,这让供应商更有理由开始实现它,因为规范已达到 CR 状态)。

这里的教训是永远不要引用 W3C 技术文档的旧版本作为规范。永远记得查看最新的规范;您应该能够在文档的标题中找到一个链接。

于 2013-08-08T21:17:08.657 回答