Html 伪选择器（如：hover）能否与通用选择器一起使用？_Html_Css

Html 伪选择器（如：hover）能否与通用选择器一起使用？

html css

Html 伪选择器（如：hover）能否与通用选择器一起使用？,html,css,Html,Css,我一直在尝试开发一些组件，除非它们的父div处于悬停状态，否则它们会隐藏自己。我试图将CSS与HTML结构相结合，因此我的规则结构如下： .show-on-hover { display:none; } *:hover > .show-on-hover { display:block; } 我知道浏览器有时会阻塞通用选择器，这里就是这样。当在iFrame内部（比如JSBin）时，或者如果我将*：hover更改为p:hover，代码就会工作。然而，Chrome拒绝在正常环境下承认该

我一直在尝试开发一些组件，除非它们的父div处于悬停状态，否则它们会隐藏自己。我试图将CSS与HTML结构相结合，因此我的规则结构如下：

.show-on-hover
{
  display:none;
}
*:hover > .show-on-hover
{
  display:block;
}

我知道浏览器有时会阻塞通用选择器，这里就是这样。当在iFrame内部（比如JSBin）时，或者如果我将

*：hover

更改为

p:hover

，代码就会工作。然而，Chrome拒绝在正常环境下承认该规则

您可以在这里看到我的代码，但您需要将其从JSBin中取出并放入一个文件中，才能真正看到发生了什么

这听起来像是一个愚蠢的问题，也许我只是没有看到一些东西，但这是规范的一部分吗？如果是的话，在哪里，为什么没有更详细的记录？为什么它可以在iframe中工作，但不能在浏览器的常规部分工作

编辑：

我将代码更改为：

:not(fakeTag):hover > .show-on-hover
{ 
  display:block;
}

它正是我想要的

*：hover>.show on hover

所做的。如果规范中对

选择器或

选择器有限制，为什么会有限制，因为我可以做这样愚蠢的事情来绕过它？

我现在觉得自己很愚蠢：）

这个问题是通过改变来解决的

<!doctype>

到

奇怪的是，我直到现在才注意到这一点。我开发了多少个网站，只是使用它，却没有意识到它是无效的？

在Chrome for me（Mac）中运行良好。据我所知，这是完全合法的。你刚才试过JSBin吗？因为JSBin会杀了你。使用实际文件进行尝试，看看是否可以复制错误。我还在Mac电脑上使用Chrome浏览器。这个错误也发生在Firefox上。如果jsbin可以“欺骗你”，为什么它会作为一个支持测试用例提供？它不是非法的，只是多余的。

你刚刚尝试过jsbin吗？

没有，我将代码粘贴到一个HTML文件中，并在Chrome中运行它。没问题。

<!doctype html>