为什么特定的 CSS 规则不会覆盖一般规则？答案

【问题标题】：Why doesn't a specific CSS rule override a general one?为什么特定的 CSS 规则不会覆盖一般规则？
【发布时间】：2010-09-13 19:31:12
【问题描述】：

作者的编辑：很抱歉对此造成混淆。我将路径更改为另一个文件夹并从旧文件中读取！我的错。感谢大家的帮助。

我的理解是，如果您将特定规则置于 CSS 中的一般规则之下，则特定规则应覆盖一般规则。例如，在这个正在开发中的page，我有以下代码：

body id如下：

<body id="inside" class="blog">

<h3><a href="http://dev.extraspecialpatient.com/blog/entry/test-blog-entry/">Test Blog Entry</a></h3>
        <p class="entry-date">published September 13, 2010</p>
        <p>
This is a test of the American Broadcasting System to see if my entry shows up properly on the website. Summary information goes here.</p>
<p>Sentence two.</p>
<p>Sentence three.</p>

这是该内容的通用样式：

body#inside #content p { 
                        margin: 0; 
                        padding: 0 0 20px 20px; 
                        color: #000; 
                        font: 14px/22px "Myriad Pro", Arial, sans-serif; 
                        }

我需要修改段落的填充并设置日期信息的样式，因此我在下面放置了以下内容：

body#inside.blog #content p             { padding: 0 20px 10px 20px; }
body#inside.blog #content p.entry-date      { 
                                font-size: 11px; 
                                color: #4d6b53; 
                                font-style: italic;
                                margin: -3px 0 0 20px;
                                padding: 0;
                                }

如果能帮我解决这个问题，我将不胜感激。

谢谢！

【问题讨论】：

我根本没有看到元素检查器中出现您的具体规则。它们在哪里添加？
我的错。我将路径更改为另一个目录，它已从旧目录中准备好。很抱歉给您带来麻烦。
一切正常。

标签： css styles

【解决方案1】：

我在your CSS file 和 HTML 文档中都看不到您在上面引用的更具体的规则。我忽略了什么吗？您可能忘记上传了。

此外，没有必要比一般规则更具体：使用

body#inside #content p

就够了。规则出现在一般规则之后这一事实足以覆盖它们。

【讨论】：

【解决方案2】：

您的 HTML 中没有 #content ID。

【讨论】：

我看到了一个：<div id="content">
@mkoistinen 只是说这不是真的。
OP 只发布了正文代码，而不是整个页面的 HTML。查看链接的页面，有一个#content 元素。
是的，OP 没有在他的问题中发布完整的 HTML，因此造成了混乱。
啊，好的，那么对不起。没有注意到链接，因此我没有检查完整的代码。

【解决方案3】：

使用 firefox -firebug 插件并检查元素上当前应用了哪些 CSS。它将清楚地显示哪些样式被哪些样式表覆盖。

从这里获取萤火虫http://getfirebug.com/

【讨论】：

【解决方案4】：

当你说body#inside.blog #content p 时，它的意思是“一个 p 是 id 为 'content' 的东西的后代，它是 ID 为 'inside' 和类 'blog' 的主体的后代”

CSS 没有显示，因为 body 标记内没有任何 id 'content'。

【讨论】：

我是唯一一个在第 43 行看到 <div id="content"> 的人吗？
我的错，我只看贴的sn-p而不是整页。