首页 > 代码库 > Less-css扩展指定多层嵌套选择器样式

Less-css扩展指定多层嵌套选择器样式

//扩展Extend

Use Method:以在study上扩展指定多层嵌套选择器样式

//Share style 
.test{
    font-size:18px;
    color:#ffffff;
    ul{
        width:100px; 
        height:50px;
        li{
            float:left;
            margin-right:10px;
            width:50px;
            height:50px;
        }
    }
}

//grammar 1
.study{
    &:extend(.test ul li);
}

//grammar 2
.study:extend(.test ul li){}

//输出css
.test {
  font-size: 18px;
  color: #ffffff;
}
.test ul {
  width: 100px;
  height: 50px;
}
.test ul li,
.study {
  float: left;
  margin-right: 10px;
  width: 50px;
  height: 50px;
}

 

作者:leona

原文链接:http://www.cnblogs.com/leona-d/p/6296218.html

版权声明:本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文链接

Less-css扩展指定多层嵌套选择器样式