内联样式的CSS伪类

是否有可能使用内联样式的伪类?


例:

<a href="http://www.google.com" style="hover:text-decoration:none;">Google</a> 

我知道上面的HTML不起作用,但是会有类似的东西吗?

附言我知道我应该使用外部样式表,我这样做。 我只是好奇,如果这可以使用内联样式完成。

不,这是不可能的。 在使用CSS的文档中,内联style属性只能包含属性声明; 样式表中每个规则集中出现的同一组语句。 从风格属性规格 :

style属性的值必须与CSS 声明块的内容(不包括分隔大括号)的语法匹配,其正式语法在CSS核心语法的术语和惯例中给出如下:

 declaration-list : S* declaration? [ ';' S* declaration? ]* ; 

select器(包括伪元素),规则或其他任何CSS构造都是不允许的。

将内联样式视为应用于某个匿名超特定IDselect器的样式:这些样式仅适用于具有style属性的那个元素。 (如果该元素具有该ID,则它们优先于样式表中的IDselect器。)从技术上讲,它不起作用; 这只是为了帮助您理解为什么该属性不支持伪类或伪元素样式(它与伪类和伪元素如何提供无法表示的文档树的抽象有关文档语言)。

请注意,内联样式与规则集中的select器参与相同的级联,并在级联中取得最高优先级(即使!important如此)。 所以他们甚至优先于伪类国家。 允许内联样式的伪类或其他select器可能会引入一个新的级联级别,并带来一系列新的复杂性。

还要注意,风格属性规范的非常旧的版本最初build议允许这个 ,但是它被废弃了,可能是出于上述原因,或者因为实施它不是一个可行的select。

不是CSS,而是内联:

 <a href="#" onmouseover = "this.style.textDecoration = 'none'" onmouseout = "this.style.textDecoration = 'underline'">Hello</a> 

见示例→

而不是需要内联,你可以使用内部CSS

 <a href="http://www.google.com" style="hover:text-decoration:none;">Google</a> 

你可以有:

 <a href="http://www.google.com" id="gLink">Google</a> <style> #gLink:hover { text-decoration: none; } </style>