html中的类名样式不同，类名是一样的

Question

今天看一个网站代码，上面写了一个.on 有好多的类，它引用这个类是怎么引用正确的？？

Answer 1

li.on 表示的是类名为on的li标签
div.on 表示的是类名为on的div标签
li.on .ejcd 表示的是类名为on的li标签中的类名为ejcd的标签
这些是CSS选择器的基本知识，如果对CSS知识掌握不够，建议先掌握一下
另外一提，这个代码写的，太烂了……冗余度太高了，不够精简，通常选择器的层数都是不大于3层的。
HTML、CSS之类的知识，推荐一本书吧，可能对你的学习有帮助 《HTML5布局之路》，里面的内容很精简，基于实际工作书写的追问

你说的这个选择器的层数不大于3层，意思就是比如说这个 .navtop ul li.on .ejcd 可以写成 li.on .ejcd就是尽可能简单写，能表达清楚就直接写类名吗

Answer 2

这不是on类本身的样式啊，而是它下属子类的样式啊，比方说 li.on 是个父亲，那么 .hothit 就是它的儿子，而后面的样式就是这个儿子的样式，不是on这个父亲的样式，明白没？同理，.ejcd 是 li.on 的另一个儿子，dd 则是 .ejcd 的儿子（也就是 li.on 的孙子），.ddf 是 dd 的儿子（也就是 li.on 的重孙子）。

也就是说，只要给 li 套用了 on 这个类，那么它后面的一大堆子孙就会自动套用指定的样式。