如何匹配有特定孩子的父母？

Question

  

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

我想匹配一个带有id“breadCrumb”的内容，只要它的子跨度为“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中不支持应用多个类选择器（上一个示例）。