CSS父/祖先选择器[重复]

Posted 2023-03-06

【中文标题】CSS父/祖先选择器[重复]

【英文标题】：CSS Parent/Ancestor Selector [duplicate]

【发布时间】：2010-11-18 02:47:05

【问题描述】：

可能重复：Is there a CSS parent selector?

我知道这是在黑暗中拍摄，但有没有办法只使用 css、CSS2、没有 jquery、没有 javascript 来选择元素的祖先并设置样式？我已经浏览了选择器，但我发布了这个，以防我遗漏了什么或者有一个聪明的解决方法。

例如，假设我有一个类名为“test”的表嵌套在一个 div 中。有没有什么：

<div>
    <table class="test">
    </table>
</div>

div (with child) .test

     /*styling, for div, not .test ...*/

【问题讨论】：

向包含的 div 添加类是否有问题？

【参考方案1】：

在 CSS2 或 CSS3 中没有父选择器之类的东西。实际上，可能永远不会有，因为一旦您开始使用父选择器，CSS 的整个“级联”部分就不会很好处理。

这就是 jQuery 的用途 :-)

【讨论】：

jQuery 和 JavaScript 通常用于添加用户界面功能；不是为了指定任何样式。由于 CSS 的缺点，jQuery 和 JavaScript 用于样式，但不是为此目的。

首先，那句话后面有一个笑脸。其次，我不同意。能够通过 CSS 指定所有表示方面会更好吗？当然。可能吗？不。jQuery 是一个出色的工具，可以让您丰富用户体验——如果这包括设置一种无法以一致方式设置的样式，那么这正是我要做的。

-1 用于 jQuery，OP 可以简单地求助于 vanilla JS。

【参考方案2】：

在 CSS 中有一个 :empty 选择器可以让你匹配空元素，你可以用 :not 选择器来否定效果。

div:not(:empty) 
    // your styles here

但是我不确定是否所有浏览器都支持这个。

【参考方案3】：

div:not(:empty) 
    margin:0;

http://jigsaw.w3.org/css-validator/ 无法将其识别为 CSS2

CSS 的目的是将更多包含的元素“级联”到更具体的元素。我想你有可能“颠倒你的逻辑”，就像在

div.myclass    /* format parent */ 
div.myclass *  /* neutralize formats in descendants */
div.myclass img  /* more specific formats for img children */ 

祝你好运 迈克

【讨论】：

这不能改变父级的格式，具体取决于它的后代，这是 OP 所要求的。

【参考方案4】：

：Firefox 支持空伪类，但不兼容 IE。

但 IE 的一个非常简单的 jQuery 解决方法是 http://www.webmasterworld.com/css/3944510.htm 。救了我的培根