我们可以在一个选择器中嵌套另一个选择器来实现继承,这样很大程度减少了代码量,并且代码看起来更加的清晰。
less源码:
#header {
h1 {
font-size: 60px;
font-weight: bold;
}
p {
font-size: 40px;
a {
text-decoration: none;
&:hover {
border: 1px dashed pink;
}
}
}
}
css源码:
#header h1 {
font-size: 60px;
font-weight: bold;
}
#header p {
font-size: 40px;
}
#header p a {
text-decoration: none;
}
#header p a:hover {
border: 1px dashed pink;
}
说明:
&符号的使用 —如果你想写串联选择器,而不是写后代选择器,就可以用到 &了。这点对伪类尤其有用
如 :hover和 :focus。