Question

less定义一个通用的样式怎么定义

Answer 1

2
3
4
5
6
7
8

//LESS源码
@color:#4D926F;
#header{
color:@color;
}
h2{
color:@color;
}

1
2
3
4
5
6
7

/*编译后的CSS*/
#header{
color:#4D926F;
}
h2{
color:#4D926F;
}

混合
混合是指在一个 CLASS 中引入另外一个已经定义好的的 CLASS，就像在当前 CLASS 中增加一个属性一样。Less实现了这种嵌套。我们还可以使用参数，就好像我们再用一个函数一样。

1
2
3
4
5
6
7
8
9
10
11
12

//LESS源码
rounded-corners(@radius:5px){
border-radius:@radius;
-webkit-border-radius:@radius;
-moz-border-radius:@radius;
}
#header{
.rounded-corners;
}