如何匹配有特定孩子的父母？ [复制]

Question

可能重复：
Complex CSS selector for parent of active child

我想匹配一个 id 为“breadCrumb”的，只有当它有一个子 span id“userName”时。

匹配：

<div id="breadCrumb" class="nav">
    <span id="userName">esac</span>
</div>

但不匹配：

<div id="breadCrumb" class="nav">
    <span id="navtrail">...</span>
</div>

我想设置 #breadCrumb { display: none; }，但我不想在第二种情况下隐藏它。

Answer 1

首先，这两个元素不在同一个页面上，是吗？如果是这样，则它是无效的 HTML，因为您不能（不应该）重复 ID。

你不能用直接的 CSS 做到这一点。我的建议是重申这个问题：

<div id="breadCrumb" class="nav userName">
    <span>esac</span>
</div>

或

<div id="breadCrumb" class="nav navtrail">
    <span>...</span>
</div>

然后您可以执行以下操作：

#breadCrumb.navTrail { display: none; }

或

div.nav.navTrail { display: none; }

IE6 不支持应用多个类选择器（上一个示例）。