当前位置: 首页 > 面试题库 >

内联样式在CSS中充当:hover

程志新
2023-03-14
问题内容

我知道将CSS样式直接嵌入到它们会影响的HTML标记中会破坏CSS的许多目的,但有时对于调试目的很有用,例如:

<p style="font-size: 24px">asdf</p>

嵌入规则的语法是什么:

a:hover {text-decoration: underline;}

放入A标签的样式属性中?显然不是这个…

<a href="foo" style="text-decoration: underline">bar</a>

…因为这将一直适用,而不是仅在悬停期间适用。


问题答案:

恐怕无法完成,伪类选择器无法内联设置,您必须在页面或样式表上进行设置。

我应该提到,从 技术上讲,应该 能够按照CSS规范进行操作,但是大多数浏览器都不支持

编辑: 我只是做了一个快速测试:

<a href="test.html" style="{color: blue; background: white} 
            :visited {color: green}
            :hover {background: yellow}
            :visited:hover {color: purple}">Test</a>

而且它不适用于IE7,IE8 beta 2,Firefox或Chrome。其他人可以在其他任何浏览器中进行测试吗?



 类似资料:
  • 本文向大家介绍如何在HTML元素中使用内联CSS样式?,包括了如何在HTML元素中使用内联CSS样式?的使用技巧和注意事项,需要的朋友参考一下 使用style 属性设置内联CSS样式。以下是语法- 语法 在这里,mystyles 是一个或多个CSS属性。用分号分隔它们。 示例 您可以尝试运行以下代码以为HTML中的元素实现内联CSS样式-

  • 我非常喜欢React中的内联CSS模式,并决定使用它。 但是,不能使用和类似的选择器。那么,在使用内联CSS样式时,实现悬停高亮显示的最佳方法是什么? #reactjs的一个建议是使用一个可点击的

  • 问题内容: 是否有可能使用内联样式的伪类? 例: 我知道上述HTML不能正常运行,但是有类似的东西吗? 附言:我知道我应该使用外部样式表,并且可以。我只是好奇是否可以使用内联样式来完成。 问题答案: 不,这是不可能的。在使用CSS的文档中,内联属性只能包含属性声明。样式表中每个规则集中出现的同一组语句。根据样式属性规范: style属性的值必须匹配CSS 声明块(不包括定括号)的内容的语法,其声明

  • 问题内容: 是否有CSS选择器通过其内联样式属性值选择此元素? 就像是 问题答案: 内联属性与任何其他HTML属性没有什么不同,并且可以与子字符串属性选择器匹配: 正是由于这个原因,它 非常脆弱 。由于属性选择器不支持正则表达式,因此只能执行与属性值 完全 匹配的子字符串。例如,如果属性值中的某处有空格,如下所示: 在您更改选择器以适应空间之前,它不会匹配。然后,它将停止匹配 不 包含空格的值,除

  • 问题内容: 我非常喜欢React中的内联CSS模式,并决定使用它。 但是,您不能使用和类似的选择器。那么,在使用内联CSS样式时实现悬停时高亮显示的最佳方法是什么? 该有一个状态,并将其作为道具的链接。但是,(我的方式来实现它)包裹的,以便它可以设置并给它。不过,这会使事情有些复杂(例如,包裹在行为上与有所不同)。 有没有更简单的方法? 问题答案: 我处于同样的情况。确实像在组件中保留样式的模式,