Html 如何在CSS中只针对：hover元素而不针对其父元素？

所以我有嵌套的div。当我将鼠标移到一个div上时，我希望该div而不是其他div得到一个

框阴影

。不幸的是，

：hover

ed div的父项也在

框阴影中，因为它们具有相同的签名。我无法改变这一点，因为它们来自无限嵌套的模板


我想我只需要针对任何
的列表项：用
框阴影
悬停
ed，然后针对其父项，以防止它们表达
框阴影
，但我不知道如何在CSS中表达这一点：

ul:hover{
  box-shadow: 0px 1px 2px 1px rgba(0,0,0,0.12);
}

<some statement..?>{
  box-shadow: none;
}

ul：悬停{
盒影：0px 1px 2px 1px rgba（0,0,0,0.12）；
}
{
盒影：无；
}

编辑：
您可以通过为元素指定id来完成此操作：

<style type="text/css">
div[id='child']:hover{
background-color:purple;
}

</style>

<div id='parent'>

Hello<br>
<div id='child'>hi<div>

</div>


div[id='child']：悬停{
背景颜色：紫色；
}
你好

你好

您没有选择正确的元素。使用：

span:hover {
  box-shadow: 0px 1px 2px 1px rgba(0,0,0,0.12);
}

Fiddle:
如果您有一个嵌套模板，而您无法修改其结构，您可以始终使用css专用性来覆盖悬停时的视觉效果（添加框阴影）

我看到你有
ul:hover{box shadow:0px 1px 2px 1px rgba（0,0,0.12）；}

你想避免它适用于所有的li，对吗

您应该应用于每个li，而不是ul，如果您需要重写某些属性，而无法在html中添加ID或类来修改结构，您可以使用特殊性来重写某些属性

例如，如果要覆盖

 ul:hover{
  box-shadow: 0px 1px 2px 1px rgba(0,0,0,0.12);
}

您可以更具体地将父元素添加到选择器中，如：

div ul:hover{
   box-shadow: 0px 1px 2px 1px rgba(0,0,0,0.12);
}

在这里检查特殊性是如何工作的

编辑

注意到添加的JSFIDLE后：

只需选择li元素，但：

ul li:hover{
  box-shadow: 0px 1px 2px 1px rgba(0,0,0,0.12);
}

在jsfiddle中的div后面有一个span。
然后，您可以简单地以跨度为目标，向其添加显示块和100%宽度，以提供与应用于li的框阴影相似的框阴影：

ul li span:hover{
  box-shadow: 0px 1px 2px 1px rgba(0,0,0,0.12);
}

span{ display:block; width:100%; }

如果需要以父元素为目标，则当前CSS3规范中没有可用的选择器。您可以使用此CssParentSelector jQuery插件作为解决方法，并能够在CSS中选择父元素：
您希望有选择地以div为目标。您希望以div元素的任何唯一DOM结构为目标吗？i、 它们是具有特定ID的元素的子元素，而其他div不是吗？据我所知，没有可用的父目标语法。。但是，请仔细阅读。您可以发布这个嵌套模板的JSFIDLE吗？只需检查容器上的元素并将其复制为html，然后将粘贴复制到JSFIDLE中。@Randyaa我想对整个UL进行阴影处理，它是
：悬停的
，其他任何东西（如其父级）都不需要无限嵌套；不幸的是，由于这个原因，我无法直接命名正在运行的元素或为它们提供类；这并不是说他们想要专门针对一个元素，而是他们想要——而不是——针对父元素，而只是针对底层元素。你的解决方案是给所有的东西和它的母亲一个id。他们想要避免选择父母；这是目前不可能实现的。我希望阴影能够封装整个项目，而不仅仅是其中的文本。我知道把我的选择器放在哪里，tyvm。@Daedalus不可能吗？真的吗？@ThatTree在css3中没有父选择器。css4中可能有一个；这是说明书：下面是一些进一步的阅读：@ThatTreeOverThere误解了你的问题。不幸的是，我唯一能想到的实现方法是使用javascript。我想选择整个列表，而不仅仅是其中的文本。我想让它做它现在正在做的事情，只是不是在树中的每个元素上。好的，那么你想选择哪个元素，而不是哪个？当我将鼠标移到顶部时，我想选择包含所有内容的容器。当我将鼠标移到一个较低的级别时，我只想选择那个容器，而不是上面的容器？它似乎来自一个角度js应用程序…它是。我只是不想嵌入我的整个应用程序，因为这远远不是一个好的选择；我只是加入了它的渲染形式，因为这是真实效果所需要的全部