跟Howard学LESS之初见LESS,上代码:

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>跟Howard学LESS之初见LESS</title> <style type="text/css"> .conten ul{ list-style: none; } .conten li{ height: 25px; line-height: 25px; padding-left: 15px; background: url("arr.jpg") no-repeat center left; } .conten li a{ text-decoration: none; color: #535353; font-family: microsoft yahei, "黑体", Arial, Simsun, "Arial Unicode MS", Mingliu, Helvetica; } /*less的写法如下*/ .conten { ul{ list-style: none; } li{ height: 25px; line-height: 25px; padding-left: 15px; background: url("arr.jpg") no-repeat center left; a{ text-decoration: none; color: #535353; font-family: microsoft yahei, "黑体", Arial, Simsun, "Arial Unicode MS", Mingliu, Helvetica; } } } </style></head><body><div class="conten"> <ul> <li><a href="http://www.quban18.com/shiwuquban/dasuanquban/">大蒜祛斑</a>这是测试文档</li> <li><a href="http://www.quban18.com/zhongyaoquban/">中药祛斑</a>这是测试文档</li> <li><a href="http://www.quban18.com/shiwuquban/dasuanquban/">大蒜祛斑</a>这是测试文档</li> </ul></div></body></html>

Less部份:

.conten {
ul{
list-style: none;
}
li{
height: 25px;
line-height: 25px;
padding-left: 15px;
background: url("arr.jpg") no-repeat center left;
a{
text-decoration: none;
color: #535353;
font-family: microsoft yahei, Arial, Simsun, "Arial Unicode MS", Mingliu, Helvetica;
}
}
}