Question

CSS：

#holidayclosings ul{
margin:0;
padding:0;
background:red;
}

HTML：

<ul id="holidayclosings">
<li>Saturday, December 24: <b>Closed</b></li>
...

据我所知，#holidayclosings ul规则没有效果。如果我将其更改为仅ul它可以工作，但它会影响整个页面，而不仅仅是这一个列表。显然我忘记了什么，但我没有喝足够的咖啡而我正在画一个空白。有人可以帮助我吗？

Answer 1

因为您尝试选择ul元素作为#holidayclosings元素的后代。尝试：

#holidayclosings {
    margin     : 0;
    padding    : 0;
    background : red;
}

如果要使用标签名称和标识符在CSS中选择元素（注意标签名称和ID之间没有空格）：

ul#holidayclosings {
    margin     : 0;
    padding    : 0;
    background : red;
}

但是对于使用ID选择的元素，这没有意义，因为DOM中只能有一个元素。按属性选择元素更有用：

ul.holidayclosings {
    margin     : 0;
    padding    : 0;
    background : red;
}

OR

ul[name="holidayclosings"] {
    margin     : 0;
    padding    : 0;
    background : red;
}

Answer 2

它不起作用，因为CSS规则#holidayclosings ul正在ul id的元素中寻找holidayclosings。要定位ul本身，请使用：#holidayclosings或ul#holidayclosings（后者几乎完全是多余的，因为只有一个元素的给定{{1}在文档中，所以它的元素类型并不重要。）

选择器之间的空格是descendent selector (see the W3.org entry)。

Answer 3

#holidayclosings ul会将所附的样式应用于任何具有#holidayclosings id的元素后代的ul。

你想要的是：

#holidayclosings {
    margin:0;
    padding:0;
    background:red;
}

可以使用原始选择器的示例：

<div id="holidayclosings">
    <ul>
        <li>Saturday, December 24: <b>Closed</b></li>
        ...
    </ul>
    <ul>
        <li>Saturday, December 24: <b>Closed</b></li>
        ...
    </ul>
</div>

在这种情况下，样式将适用于#holidayclosings div中的两个ul。

Answer 4

你的声明中有一个无关的ul。您可以（但不要！）执行ul#holidayclosings但现在您的CSS声明假定ul是#holidayclosings的孩子

Answer 5

或

ul#holidayclosings {
    margin     : 0;
    padding    : 0;
    background : red;
}

为什么我的身份证不适用？

5 个答案: