示例

//radius.less#header,#footer{	-webkit-border-radius: 5px;  	-moz-border-radius: 5px;  	-ms-border-radius: 5px;  	-o-border-radius: 5px;  	border-radius: 5px;}

//example6.less@import "radius.less";@the-border:1px;@base-color:#111;@red:#842210;#header{	color:(@base-color * 3);	border-left:(@the-border*10);	border-right:(@the-border * 2);}#footer{	color:(@base-color + #003300);	border-color:desaturate(@red,10%);}

说明

@import "radius.less" 表示通过import引入一个名字叫radius的less文件

生成的csss文件(example6.css)

#header,#footer {  -webkit-border-radius: 5px;  -moz-border-radius: 5px;  -ms-border-radius: 5px;  -o-border-radius: 5px;  border-radius: 5px;}#header {  color: #333333;  border-left: 10px;  border-right: 2px;}#footer {  color: #114411;  border-color: #7d2717;}

在html文件中使用css(less6.html)

</html>

本文转自 素颜猪 51CTO博客，原文链接: