爲什麼我的ID沒有被應用？

CSS：爲什麼我的ID沒有被應用？

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

HTML：

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

所以據我可以告訴#holidayclosings ul規則沒有影響。如果我將其更改爲ul，它會起作用，但它會影響整個頁面，而不僅僅是這一個列表。顯然我忘了一些東西，但我沒有足夠的咖啡，我畫了一個空白。有人可以幫助我嗎？

來源

2011-12-14 aslum

因爲您試圖選擇作爲#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; 
}

來源

2011-12-14 18:40:52 Jasper

解釋和解決方案。完善。 – Mathletics 2011-12-14 18:42:23

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

在這種情況下，樣式將同時適用於UL的的內#holidayclosings div。

來源

2011-12-14 18:40:29

你在聲明中有一個多餘的ul。您可以（但不要！）做ul#holidayclosings但現在你的CSS聲明假定ul是#holidayclosings

來源

2011-12-14 18:41:39 Mathletics

孩子它不會因爲CSS規則#holidayclosings ul是一種id的元素中尋找ul工作的holidayclosings。目標ul本身使用：#holidayclosings或ul#holidayclosings（後者幾乎完全是多餘的，因爲在文檔中只能有一個元素的給定id，所以它的元素類型無關緊要）。

選擇器之間的空間是descendent selector (see the W3.org entry)。

來源

2011-12-14 18:41:48

或者

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

來源

2011-12-14 18:41:50

爲什麼我的ID沒有被應用？

回答

相關問題