覆盖是一种常用的策略,也是一种不太优雅的方式,如下代码,为了让每个house中间的20px的间距,但是第一个house不要有间距:
.house{ margin-top: 20px; } .house:first-child{ margin-top: 0; } 复制代码
其实可以改成这样:
.house + .house{ margin-top: 20px; } 复制代码
只有前面有.house的.house才能命中这个选择器,由于第一个.house前面没有,所以命不中,这样看起来代码就简洁多了。
还有这种情况,如下代码所示:
.request-demo input{ border: 1px solid #282828; } .request-demo input[type=submit]{ border: none; } 复制代码
其实可以借助一个:not选择器:
.request-demo input:not([type=sbumit]){ border: 1px solid #282828; } 复制代码
这样看起来代码也优雅了很多。