【前端框架学习笔记】LessCSS(2):语法(1)

今天来讲一下Less的基本语法。让我们打开代码编辑器。

1. 

@charset "utf-8";

作用:为了避免中文乱码,需要先在第一行写上这句代码。


2. 

/**/ 或 //

作用:注释。它们的区别在于,如果文件夹内有同名的css文件(即abc.less的同名文件abc.css),则/**/的注释内容会被自动从less引入到css(其他会被编辑的代码同理),而 // 后的内容则不会。


3.

@变量名:值;

作用:less可以定义变量,方法就是 @变量名:值;

变量的使用:举个例子

body部分有一个以box为class名的div:


如果要给div设置300px的宽度,则对应的less部分可以这样写

@var-width: 300px;

.box{

 width:@var-width;

}


由于时间关系,今天就暂时写这么多,未完待续。

--------

免责声明:http://www.jianshu.com/p/cd9793098eea

你可能感兴趣的:(【前端框架学习笔记】LessCSS(2):语法(1))