css - 伪元素上的伪类

标签 css css-selectors pseudo-element pseudo-class

明确地说,我并不是要为 css 创建(伪)开始。只是想检查是否可以在伪元素上添加伪类。例如:

.some-class:after:hover {
}

似乎不起作用。

这虽然有效:

.some-class:hover:after {
}

当然,这不是:

.some-class:hover:after:hover {
 }

我想做的是 - 有一个 div。如果你将鼠标悬停在那个 div 上,我会在 div 上使用 :after 附加一个删除图标。我想设计这个图标的样式(比如,让它缩放到 1.1 左右)。这可能纯粹在 CSS 上吗?我只需要它在 Chrome 上工作。

最佳答案

不,当前标准不允许将伪类附加到伪元素。伪元素唯一可能出现的地方是复杂选择器的最后,并且在它之后不能出现其他选择器或组合器。引用spec .

WebKit 等一些实现有自己的规则,但它们是非标准的并且不能跨浏览器工作。它们也可能不适用于所有伪类和/或所有伪元素。例如,据我所知,:after:hover 不适用于任何浏览器,包括 Chrome。

无论哪种方式,您都需要使用实际元素而不是伪元素。

关于css - 伪元素上的伪类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27664840/

相关文章:

css - 使用 BeautifulSoup/CSS-Selectors 解析同级行

css - 不是 CSS 选择器

javascript - 使用 javascript(或 jQuery)选择和操作 CSS 伪元素,例如::before 和::after

html - 如何使更多的 div 彼此非换行,但整个列表换行?

html - 不使用 float 将 2 个 div 对齐在同一行

java - 如何通过 Selenium 和 Java 单击“停用”按钮,然后单击“激活”按钮

CSS :after pseudo-element combined with [checked]: different after-elements not working?

html - 将伪元素添加到带有链接的按钮

jquery - 如何使用 jQuery UI 主题设置表单样式

html - 如何将页脚 (div) 对齐到页面底部?