html - 为什么我的 CSS 代码没有将指定 div 中的所有文本都变成白色？

Question

我正致力于网络开发，而 CSS 很早就让我受益匪浅。我有以下 html...

<div class="span-6" id="left-sidebar"> 
    <h4>Left Sidebar</h4> 
    <ul> 
        <li>fruits</li> 
        <li>meats</li> 
    </ul> 
    <h4>This is a header</h4> 
</div> 

还有我的 CSS 代码...

#left-sidebar, #right-sidebar {
    background-color: black;
    color: white;
}

但只有文本“fruits”和“meats”呈现为白色文本，其他文本呈现为深灰色。为什么不是所有文本都呈现为白色？

另外，我发现我可以更具体地使用 CSS 代码来解决这个问题...

#left-sidebar, #left-sidebar h4,   {
    background-color: black;
    color: white;
}

为什么我必须更具体？ #left-sidebar 不是意味着“使用白色呈现左侧栏中的所有文本，除非它被更具体的 CSS 语句覆盖”吗？

我还应该注意，我没有任何其他与左侧边栏 div 相关的 CSS 代码。另外，我正在使用 Blueprint CSS(正如您在“span-6”类中看到的那样)，但我不知道这怎么会与任何东西发生冲突。

非常感谢!

Answer 1

Blueprint css 具有标题标签的默认颜色。 (参见 screen.css)

您需要指定:

#left-sidebar h2, #left-sidebar h4, 
#right-sidebar h2, #right-sidebar h4 { color: white; }