html - 无法修改带有#ID 的 CSS

Question

首先，我的菜单现在是这样的。

问题是应该看到 dsasdf div 中的边界线和这个背景。

我当前的 HTML 代码是:

<div id='cr'>
        <div>
            NEWS
            <div id="m_news">dfadf</div>
        </div>
</div>

#cr 的 CSS:

  div#cr{

    /*background-color:#1a0f08;*/
    float:right;
    padding:10px;
    width:260px;
    height:100%;
}
div#cr div{
    background-image:url("../img/bg_post.jpg");
    background-position:0px -5px;
    background-repeat:repeat-x;
    border-radius:2px;
    color:#663b20;
    margin-top:5px;
    height:80px;
    padding:8px;
}
div#cr div:hover{
    border:1px solid #bd8100;
    color:#FFF;
}

#m_news 的 CSS:

div#m_news{
background-image:url("../img/menu/messages.gif");
border:0;
}

问题是 m_news ID 无法修改之前由#cr 设置的 CSS，即使它更像是一般的页面修改。我曾尝试在 Internet 上搜索此问题的答案，但据我所知，它有时取决于您的 CSS 代码的位置，但我尝试更改顺序，但均无效。

为什么 div#cr div 比 div#m_news 更重要？

还有，不设置ID，怎么在最里面的DIV里设置CSS呢？我是说，

我如何将新的 CSS 设置到 #id1 中的最小框而不修改另一个大框？

Answer 1

div#cr div 的优先级高于 div#m_news。您可以将其更改为 div#cr div#m_news。

您可以在此页面上阅读有关特异性的更多信息:Understanding Style Precedence in CSS: Specificity, Inheritance, and the Cascade .

可以看到优先级是这样排列的:

• 元素、伪元素:0,0,0,1
• 类，伪类，属性:0,0,1,0
• ID:0,1,0,0
• 内联样式:1,0,0,0

所以根据这个:

div#cr div 具有 0,1,0,2 的特异性，而 div#m_news 具有“仅”之一 < em>0,1,0,1。