这里是一个我不明白的例子:
.container_12 .grid_6,.container_16 .grid_8 { width: 460px; }
在我看来,宽度:460px适用于所有上述类。但是为什么有些类用逗号(,)分隔,有些只用空格分隔呢?
我假设宽度:460px将仅应用于那些以CSS文件中提到的方式组合类的元素。例如,它将应用于< div class ='container_12 grid_6'>但不会应用于< div class ='container_12'>。这个假设是正确的吗?
解决方法
.container_12 .grid_6,.container_16 .grid_8 { width: 460px; }
这说“make all .grid_6在.container_12内,所有.grid_8在.container_16的460像素宽内。因此,以下两者将呈现相同:
<div class="container_12"> <div class="grid_6">460px Wide</div> </div> <div class="container_16"> <div class="grid_8">460px Wide</div> </div>
至于逗号,它应用一个规则到多个类,像这样。
.blueCheese,.blueBike { color:blue; }
它的功能等同于:
.blueCheese { color:blue } .blueBike { color:blue }
但减少冗长。