Question

<div id="tt">test1</div>
    <div id="blabla">test2</div>
<div id="test">
    <div id="blabla">test3</div>
    <div id="tt">test4</div>
</div>
<style>
    #tt {color:blue;}
    #blabla {color:green;}
    #test #tt, #test #blabla etc... {color:red;}
</style>

有没有办法避免重复#test？

谢谢;）

Answer 1

对于之前的问题的特定示例，它经历了重大修订：

* { color: red }

CSS非常关注上下文。在处理与真实代码几乎没有相似之处的假设时，它并不是很好。

Answer 2

取决于你想做什么。如果您希望所有文本节点都是红色且父元素为#test，那么您只需要#test {color:red}。如果您需要更具体，并且仅为孩子提供颜色，那么您可以使用.child {color:blue}，但如果您想为#test的孩子着色，那么您需要指定祖先后代，换句话说#test .child {color:green}

修改

根据我的评论示例http://jsbin.com/udoya3

Answer 3

您应该使用id和class，而不是在这里使用id。 id应该是唯一的：一个id，一个元素。班级不是唯一的。一个类可以有多个元素。

<style>
    .tt,.t {color:red;}
</style>

<div class="tt">test1</div>
<div id="test">
    <div class="tt">test2</div>
</div>

Answer 4

#test, #t, #tt { color:red; }

是完全有效的代码。

#id优先于任何其他可能产生不利影响的样式（即类），但也可能需要。

你真的想做什么？写css时保存几个字符？

如何减少CSS

4 个答案: