css - 为什么我的 ID 没有被应用？

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

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

#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;
}

或

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