Question

<div id="maincontent">
    <div id="content">
        <div id="admin"></div>
    </div>
</div>

只有使用CSS存在#maincontent时，才有可能匹配#admin的规则吗？

我只是在控制面板中有背景颜色，但不希望它出现在访客中。

Answer 1

不幸的是，CSS中没有父选择器。

您必须使用javascript在客户端上执行此操作。

Answer 2

选择父元素？你可以用css4！

$#maincontent #admin {
   background:hotpink;
}

哪个有效..在......嗯... ......

然而，有了令人敬畏的jquery脚本，是的，先生，你可以！

cssParentSelector.js

如果你喜欢CSS，那么在许多情况下这应该是绝对的工具

Answer 3

不幸的是，您不能仅使用css选择器来定位节点的父节点。你必须使用一些Javascript或jQuery这样做。以下是如何使用javascript和jQuery实现所需功能的两个示例。

以下是javscript中的内容：

if (document.getElementById("admin") != null) { // if there is a node with "admin" as ID
    document.getElementById("maincontent").style.backgroundColor = "#000"; // changes the background to black
}

以下是jQuery中的内容：

if ($("#admin").size() === 1) { // if there is a node with "admin" as ID
    $("#maincontent").css("background-color", "#000"); // changes the background to black
}

Answer 4

不，没有CSS。或者，您可以使用查看管理员的CSS类母鸡。所以对于管理员来说

<div id="maincontent" class="adminBackground">
    <div id="content">
        <div id="admin"></div>
    </div>
</div>

对于普通访问者（注意删除了class =“adminBackground”属性）：

<div id="maincontent">
    <div id="content">
        <div id="admin"></div>
    </div>
</div>

然后为该类“adminBackground”定义一个角色：

.adminBackground {
     background: #AAAAAA;
}

如何在CSS中选择父母的父级？

4 个答案: