前端的学习之路：初级CSS---less混合函数

less混合函数

// 混合函数 在混合函数中可以直接设置变量
.test(@w,@h){
    width: @w;
    height: @h;
    border:1px solid red;

}
//还可以直接设置默认值
//.test(@w:200px,@h:300px){
//    width: @w;
//    height: @h;
//    border:1px solid red;
//}
//div{
//    .test(300px);
//这样宽度为300px，高度则使用默认值300px
//}
div{
    //调用混合函数，按顺序传递参数   
   // .test(200px,300px);
   .test(@w:200px,@h:200px)

}
span{
    // 颜色平均值 average
    color: average(red,yellow);
}
html{
    width: 100%;
    height: 100%;
}
body{
    width: 100%;
    height: 100%;
    background-color: blue;
}
body:hover{
    // 加深 darken
    background-color:darken(blue,10%);
}