csspreprocessorless混合函数的使用

//第三步引入这个less文件，准备使用@import"@/assets/css.less";。框{宽度：100%；高度：100%；.content{//Step4(1)使用默认的less混合函数，不传参//.content();//第四步（2）使用传入的参数//.content(600px,200px,#baf);//第四步（3）可以根据name.content2()使用对应的less混合函数}}本文只讲使用步骤，不讲基本概念。使用less文件的步骤/*第一步是在项目的assets文件夹下新建一个css.less文件，把我们需要用到的混合的less放在里面，可以有多个。比如这里放了两个less混合函数，谁指定谁谁*///第二步，用变量指定默认值.content(@width:480px,@height:360px,@background:#bfa){宽度:@width;高度：@height；背景颜色：@background;}.content2(@width:50px,@height:50px,@background:pink){宽度：@width;高度：@height；background-color:@background;}vue文件//第三步引入这个less文件，准备使用@import"@/assets/css.less";。框{宽度：100%；高度：100%；.content{//Step4(1)使用默认的less混合函数，不传参//.content();//第四步（2）使用传入的参数//.content(600px,200px,#baf);//第四步（3）可以根据name.content2()使用对应的less混合函数}}less混合函数的思想其实就是高内聚的思想和耦合度低，但只是在css层面，将常用的和相似的css提取出来，分开存储。在需要的地方介绍它。如果使用的地方稍有不同，可以通过传参来改变控件。类似于html的组件拆分，js的模块化，函数式编程。灵活使用项目的less可以让项目更容易维护。Vue中也有混合的mixin，也是用这个思想来实现代码功能的复用。以后再写一篇关于vue混音的使用