Less介绍
less是一种css语言的预处理器,是用来书写css的工具。
通俗的说,CSS预处理器是一种专门编写css代码的语言(工具),通过less来编写css代码变得更灵活,更高效,更容易维护。
在Less文件中,less代码格式并不能被浏览器识别。想将Less文件代码变成css代码,必须先将这个Less文件预先进行处理。
预处理的就可以将Less文件代码转换为css代码。
Less使用流程
先创建less文件创建一个less文件,扩展名为less,在这个文件内编写less代码
转换为css文件使用编辑器上安装插件或命令来将less文件转换为css文件
编辑器上安装的less插件在对less文件进行保存时,会自动对less文件内的代码转换为css代码,并保存为css文件,以备html引入
html文件中引入css文件在html文件中引入的是转换后的css文件,并不是原less文件。
浏览器根本不识别less代码,仅实现转换后的css代码。
1.变量
变量的作用变量用于存储数据,数据只要指的是css中多次使用的数值(尺寸、字体大小)或字符串(颜色单词)。
css中的数据指的是冒号右侧的内容。
变量的语法@变量名:数据
2、混入
混入的作用将一段css代码,引入到另一个选择器中。
混入的语法.类名()
3、 嵌套
嵌套的作用将后代选择器的代码书写在父选择器的大括号内,提高代码的可读性。
&符号 作用用于表示当前选择的元素的本身,主用于给伪类添加样式更方便。
5、导入
作用在一个less文件中引入多个css文件,可以减少html文件中的link标签的数量(提高代码的简洁性)
在实际项目中会有多个css文件,导入的本质就是将多个css文件合并到一个文件中
语法@import “导入的文件名”;
ps:每天一点小收获
