嵌套规则
嵌套规则它模仿了HTML的结构，让我们的css代码更加简洁明了清晰
实例：
传统CSS写法
#header{
color:black;
}
#header .navigation{
font-size:12px;
}
#header .logo{
width:300px;
}
less中的写法
#header{
color:black;
.navigation{
font-size:12px;
}
.logo{
width:300px;
}
}
父元素选择器&
说明：符合&表示当前选择器的父选择器
例子：
less写法
.bgcolor{
background:#ffffff;
a{
color:#888888;
&:hover{
color:#ff6600;
}
}
}
less编译结果
.bgcolor{
background:#ffffff;
}
.bgcolor a{
color:#888888;
}
.bgcolor a:hover{
color:#ff6600;
}
改变选择器的顺序
说明：将&放到当前选择器之后，就会将当前选择器插入到所有的父选择器之前
例子：
less写法
ul{
li{
.conter &{
background:mediumvioletred;
}
}
}
less编译结果
.conter ul li{
background:mediumvioletred;
}
组合使用生成所有可能的选择器列表
说明：使用两个& &
例子：
less写法
p,a,ul,li {
border-top:2px dotted #336;
& &{
border-top 0;
}
}
less编译结果
p,a,ul,li{
border-top:2px dotted #336;
}
p p,
p a,
p ul,
p li,
a p,
a a,
a ul,
a li,
ul p,
ul a,
ul ul,
ul li,
li p,
li a,
li ul,
li li {
border-top: 0;
}