内联CSS伪类 [英] Inline CSS Pseudo-classes

查看:142
本文介绍了内联CSS伪类的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我一直认为你不能在元素中添加内联: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>

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



有一个问题:它不工作 p>

有人知道为什么这不工作吗? Chrome是否未实现它或某事?



演示

w3.org 的演示代码

解决方案

事实上,同一文档在另一个问题。这是我不得不说的:


您链接到的文档是 10年草稿 strong>。


现在已经11岁了,但这不是重点(虽然它暗示了一个很可能的原因,给不工作)。重点是,给出的示例不会出现在同一个最新修订版中规范。因此,据推测,在样式属性中嵌入选择器被认为不可行,因此被丢弃。



我对在评论中链接的问题表明为什么这样的功能被认为不可行 - 它只是不兼容作为一种语言的CSS的当前状态:


请注意,内联样式与规则集中的选择器参与同级联,并且在级联中占据最高优先级(!important )。因此,它们甚至优先于伪类状态。允许伪类或内联样式中的任何其他选择器可能会引入新的级联级别,并带来一组新的并发症。


当然,我不是说那些实际做出决定和/或写出规范的人,但如果我是其中之一,那就是我不支持这个特征的原因。



这也可以解释为什么没有浏览器实现这样的功能(或者,更可能的是,缺少实现是导致其被重新考虑并最终放弃的因素,



这里的教训是永远不会引用旧的W3C技术文档修订版。始终记住检查最新规范;您应该能够在文档的标题中找到一个链接。


I have always thought that you cannot add in-line :hover{..} styles to a element, however I came across this page not that long ago, where I see stuff like this.

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

I don't like in-line styles at all, but my current app is based on in-line styles/scripts so, this would be a excellent feature for me.

There is one problem: it doesn't work.

Does anyone know why this doesn't work? Did Chrome not implement it or something?

Demo

Demo code from w3.org

解决方案

As a matter of fact, the same document was referenced in another question here. This is what I had to say about it:

That document you link to is a 10-year-old draft.

It's 11 years old now, but that's not the point (although it does suggest a very likely reason why the example you give doesn't work). The point is that the example given does not appear in the latest revision of the same specification. So, supposedly, embedding selectors in style attributes was deemed not viable and dropped as a result.

My answer to the question linked in the comments suggests why such a feature was deemed not viable — it's simply not compatible with the current state of CSS as a language:

Note that inline styles participate in the same cascade as selectors in rule sets, and take highest precedence in the cascade (!important notwithstanding). So they take precedence even over pseudo-class states. Allowing pseudo-classes or any other selectors in inline styles would possibly introduce a new cascade level, and with it a new set of complications.

Of course, I don't claim to speak for the people who actually made the decisions and/or wrote the spec, but if I were one of them, that's the reason I would have given for not supporting the feature.

That would also explain why no browser has implemented such a feature (or, more likely, the lack of implementation was among the factors causing it to be reconsidered and then ultimately dropped, giving vendors even more of a reason not to start implementing it now that the spec has reached CR status).

The lesson here is to never cite old revisions of W3C technical documents as canon. Always remember to review the latest specification; you should be able to find a link in the header of the document.

这篇关于内联CSS伪类的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆