【less中的变量】
1.声明变量:@变量名:变量值;
使用变量:@变量名;
【less中变量的类型】
1.数字 数字px
2.字符串:无引号字符串 red blue 有引号 "haha"
3.颜色 red #000000 rgb()
4.值列表类型:用逗号或空格分隔2px solid green
【变量使用原则】
多次频繁出现的值、需要修改的值,设为变量
【混合MiXin】
1.无参混合
声明: .name{} 选择器调用:.name:
2.带参混合
无默认值混合: .name(@param){} 调用:.name(parVlaue);
有默认值混合: .name(@param:value){} 调用:.name(parVlaue);parVlaue可省略
>>>如果声明时,参数没有默认值,则调用时必须赋值,否则报错
>>>无参混合,会在css中编译除同名的class选择器:有参的不会
【less匹配模式】
使用混合匹配,类似于if
.name(条件一,参数){}.name(条件二,参数){}.name(@_,参数){}
调用.name(条件值,参数值)
匹配规则:根据调用时提供的条件值,去寻找与之匹配的MiXins执行,其中@_表示永远需要执行的部分
【less中的运算】
+ -
颜色运算时,红绿蓝分三组运算,组内可进位,组间互不干涉
less中的嵌套,保留HTML结构
1.默认后代选择器,如果需要子代选择器,在子代前+>
2.&表示上一代,&:hover 上一代的hover事件
1.声明变量:@变量名:变量值;
使用变量:@变量名;
【less中变量的类型】
1.数字 数字px
2.字符串:无引号字符串 red blue 有引号 "haha"
3.颜色 red #000000 rgb()
4.值列表类型:用逗号或空格分隔2px solid green
【变量使用原则】
多次频繁出现的值、需要修改的值,设为变量
【混合MiXin】
1.无参混合
声明: .name{} 选择器调用:.name:
2.带参混合
无默认值混合: .name(@param){} 调用:.name(parVlaue);
有默认值混合: .name(@param:value){} 调用:.name(parVlaue);parVlaue可省略
>>>如果声明时,参数没有默认值,则调用时必须赋值,否则报错
>>>无参混合,会在css中编译除同名的class选择器:有参的不会
【less匹配模式】
使用混合匹配,类似于if
.name(条件一,参数){}.name(条件二,参数){}.name(@_,参数){}
调用.name(条件值,参数值)
匹配规则:根据调用时提供的条件值,去寻找与之匹配的MiXins执行,其中@_表示永远需要执行的部分
【less中的运算】
+ -
颜色运算时,红绿蓝分三组运算,组内可进位,组间互不干涉
less中的嵌套,保留HTML结构
1.默认后代选择器,如果需要子代选择器,在子代前+>
2.&表示上一代,&:hover 上一代的hover事件