Question

我在这里有一些代码：

    <html>
    <head>
        <title>Select View</title>
    </head>
    <body class="class-1 class-2 class-3 class-4 class-5 class-6">
        Many divs here
        ...
        ...
        ...
        <div id="test">
            <p>PHP code here</p>
        </div>
    </body>
</html>

我想用测试ID隐藏div。我的网站基于wordpress，因此在CSS中，我必须引用特定的正文。我尝试过：

body.class-1, .class-2, .class-3, .class-4, .class-5, div#test{
    color: red;
}

并且颜色在起作用，“ PHP代码在这里”是红色，但是当我这样做时：

body.class-1, .class-2, .class-3, .class-4, .class-5, div#test{
        display: none; //or visibility: hidden;
    }

所有站点都消失了。有什么想法只隐藏该div吗？

Answer 1

只需使用您已有的东西

div#test{
   display: none;
}

调用body.class-1, .class-2, .class-3, .class-4, .class-5,并设置display: none时，这是预期的行为，因为您正在隐藏所有元素，而不仅仅是测试div！

Answer 2

由于您没有在其他元素中重复使用id，因此只能使用

#test { 
    display: none;
}

以防万一，如果您还有另一个具有相同ID的元素（例如：span），则必须特别提到需要隐藏div element with id=test

div#test { 
    display: none;
}

如果可能的话，唯一地标记您的元素总是一件好事。由于您正在处理classes，因此，如果您仅提及一个类，它将选择匹配的元素。

在以下情况下，您使用的选择是整个身体，

body.class-1, .class-2, .class-3, .class-4, .class-5, div#test{
    display: none; //or visibility: hidden;
}

如果仅使用以下代码，则可能是相同的情况

.class-1 {
    display: none; //class-1 supposed to pick the whole body here;
}

隐藏在体内的元素，具有特定的类别

2 个答案: