如何覆盖CSS ID？

Question

我有以下css：

#app-info           { float: left; margin: 10px 10px; }
#app-info ul        { list-style-type:none; display:block; }
#app-info ul li     { padding:2px 0; }

#content            { width:650px; float:left;  }
#content ul         { padding-left: 40px; padding-bottom: 15px; }
#content ul li      { padding:5px 0; }

然后我有了代码：

<div id="content">
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>       

    <div id="app-info">
        <ul>
            <li>A</li>
            <li>B</li>
            <li>C</li>
        </ul>
    </div>
</div>

我遇到的问题是内部列表正在由content ID格式化，但我不想这样做。我只希望app-info类格式化它。我怎样才能做到这一点？

Answer 1

您可以使用Child Selector '>'代替Descendant Selector ' '。

#content            { width:650px; float:left;  }
#content > ul       { padding-left: 40px; padding-bottom: 15px; }
#content > ul li    { padding:5px 0; }

Answer 2

试试这个：

#content            { width:650px; float:left;  }
#content > ul         { padding-left: 40px; padding-bottom: 15px; }
#content > ul li      { padding:5px 0; }