在less 中使用媒体查询;
我们使用less 和媒体查询实现下面的功能:
当页面的宽度 > 500px 时,div 的背景颜色是绿色;当页面宽度<=500px 时,div的背景颜色显示红色;
.abc(@bcg){
width:
200
px;
height:
200
px;
background-color:@bcg;
}
div{
.abc(
green)
}
@media
screen
and (
max-width:
500
px){
div{
.abc(
red)
}
}
上面的代码简单的实现了这个功能;