LESS学习笔记
在招聘要求中看见的需要熟悉LESS/SASS，然而我一个都没见过。
LESS是一种动态样式语言，可以对代码进行预编译生成所需的CSS代码（呃我是这么理解的，有失偏颇），反正是了结了我“HTML和CSS哪能算编程语言呢”的疑惑。查了些资料学习了一下，当然现在学到的只是皮毛，也有不少疑惑。
注：使用的编译工具是Koala。
开头先感谢两篇文章w3cplus和bootcss，简洁明了，通俗易懂。
变量
@vname，相当于定义了一个可重复利用的值，只需要修改定义变量的数值就可以修改使用该变量的属性，需要注意的是变量只能被定义一次(后定义的变量会覆盖前面的变量)，类似于c++宏或者const常量。可以把颜色属性值red,blue等看做是css中定义好的变量，只是less中的变量使用范围广泛得多了。
变量可以计算，还可以将变量名定义为变量。
混合
可以将经常重复使用的样式整合在一起写成单独的类，再嵌套进所需要的选择器中，这个类可以传入参数甚至带上默认参数，是不是很函数很像？没错，相当于定义了一个函数并在所需要的选择器中进行调用。
多个参数可以使用逗号隔开，当传入的参数表示复合属性的时候，可以使用@arguments参数代替。
嵌套规则
当书写组合，后代选择器的时候，可以使用嵌套，很直观的看出HTML的DOM结构层次，大大减少了代码量（只是表面的假象，一味的嵌套编译生成的CSS代码选择器会多到吓死人）。
在嵌套中需要注意的是&的使用，使用&表示多类选择器，而不加&表示后代选择器。
运算符与函数
Less中的Operations主要是针对任何数字、颜色、变量的操作，可以对其是行加、减、、乘、除或者更复杂的综合运算；
而Functions主要是针对Color funtions 加减时忽略其单位名字，颜色函数主要有lighten(@color,10%),darken,saturate,desaturate,fadein,fadeout,spin等，以实参颜色为标准进行处理并返回新的颜色。
命名空间
如果有两个选择器的样式完全相同，则可以将一个选择器的样式引用到另一个选择器样式上面。
#one a {
color: red;
#two > .button;//将a标签样式引到.button类上
}这样不会造成书写混乱不堪吗？这么做节省的代码量与逻辑条理哪个更重要呢？
变量范围
变量作用范围采用就近原则，元素先找本身有没有这个变量存在，如果本身存在，就取本身中的变量，如果本身不存在，就寻找父元素，依此类推，直到寻找到相对应的变量。
注释
跟大多数编程语言相同，支持单行//和多行/**/注释
最后
跟学习任何东西一样，如果想掌握Less需要大量的练习，目前的问题是找不到使用Less的理由，比如一个变量，在拿到设计图之后并不知道每个模块具体的尺寸颜色等，需要同设计沟通。
可能在CSS使用熟练之后会养成一定的直觉吧。多练习多练习。
使用Less能够节省很多编写CSS代码的时间，且代码的可读性很强；但是冥冥之中感受到实际编译生成的CSS代码量并不会减小，根据“样式重用”的思想，如果滥用混合可能会造成代码的臃肿，这是我个人的一点感觉，毕竟刚学习Less，应当在使用中给自己提个醒，选择性的学习，有待深入。
你要请我喝一杯奶茶？
版权声明：自由转载-非商用-保持署名和原文链接。
本站文章均为本人原创，参考文章我都会在文中进行声明，也请您转载时附上署名。
