//扩展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扩展指定多层嵌套选择器样式的更多相关文章

  1. less可以做什么?less详解!(less嵌套选择器实现纯CSS二级导航)

    前端技术众多,作为一名前端工程师,我们每接触新技术首先要懂得此技术的优势和劣势,这是最基本的.往深入了说还需要懂得技术的应用场景,配合的技术等,方便为以后架构做准备.而less作为一门CSS预处理语言 ...

  2. CSS之分组选择器和嵌套选择器

    分组选择器, 将一个样式应用于多个类,或者标签啥的 每个选择器用逗号隔开 <!DOCTYPE html> <html> <head> <meta charse ...

  3. CSS 分组和嵌套选择器

    CSS 分组和嵌套选择器 一.分组选择器 在样式表中有很多具有相同样式的元素. h1 { color:green; } h2 { color:green; } p { color:green; } 为 ...

  4. CSS分组和嵌套选择器

    CSS 分组 和 嵌套 选择器 分组选择器 在样式表中有很多具有相同样式的元素.直线模组哪家好 h1 {     color:green; } h2 {     color:green; } p { ...

  5. CSS:CSS 分组 和 嵌套 选择器

    ylbtech-CSS:CSS 分组 和 嵌套 选择器 1.返回顶部 1. CSS 分组 和 嵌套 选择器 Grouping Selectors 在样式表中有很多具有相同样式的元素. h1 { col ...

  6. CSS 分组 和 嵌套 选择器

    Grouping Selectors 在样式表中有很多具有相同样式的元素. h1{color:green;}h2{color:green;}p{color:green;} 为了尽量减少代码,你可以使用 ...

  7. css border-bottom(指定下边线的样式、宽度及颜色)

    border-bottom(指定下边线的样式.宽度及颜色) border-bottom: 值: border-bottom-style:值; border-bottom-color: 值; borde ...

  8. CSS概念,引入,选择器

    概念 层叠样式表,定义如何显示HTML元素. 使用方式 行内样式 不推荐使用此方式 结构 和 样式的 杂糅会影响后期的维护 <p style="color: red"> ...

  9. 4-21 嵌套选择器 、块级元素和内联元素、光标、布局-overflow

    1.嵌套选择器 p{ }: 为所有 p 元素指定一个样式.(默认,,也就是说可以被改变样式) .marked{ }: 为所有 class="marked" 的元素指定一个样式. . ...

随机推荐

  1. VMware安装Centos7超详细过程(图文)

    1.软硬件准备 软件:推荐使用VMwear,我用的是VMwear 12 镜像:CentOS6 ,如果没有镜像可以在阿里云下载 https://mirrors.aliyun.com/centos/ 硬件 ...

  2. 纹理mag filter不能取GL_XXX_MIPMAP_XXXX

    今天遇到OpenGL error 0x0500错误,定位到 glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, magFilter); 查看ma ...

  3. iOS获取当前设备方向

    三种方式: self.interfaceOrientation [[UIApplication sharedApplication] statusBarOrientation] [[UIDevice ...

  4. 170. Rotate List【medium】

    Given a list, rotate the list to the right by k places, where k is non-negative.   Example Given 1-& ...

  5. “互联网+”取代O2O将成为2016最大风口

    2016年的最大风口是“互联网+”,经历了O2O的洗礼,B2C服务的全线崛起.跨界与场景打造的极致体验,从0到1的产业开放,都将在这一年集体爆发,“互联网+”比O2O更加接地气,更具有完整的商业模式和 ...

  6. [搬运]CORBA中BOA和POA的含义

    先来BOA,搬自:http://www.cl.cam.ac.uk/research/dtg/attarchive/omniORB/doc/2.8/omniORB2/node6.html The Bas ...

  7. JQuery EasyUI datagrid pageNumber 分页 请求/加载 两次

    解决方案: 原因是 jquery.easyui.min.js 源文件中,由于第1页的total和其他页的total不相等,EasyUI会重新发起第1页的请求!1.jQuery EasyUI 1.4.1 ...

  8. Ubuntu SVN服务器的搭建与配置(转)

    Ubuntu SVN服务器的搭建与配置 一.         安装 sudo apt-get install subversion sudo apt-get install libapache2-sv ...

  9. 浅谈Java中的补零扩展和补符号位扩展

    今天,魏屌出了一道题,题目如下: 定义一个大头序的byte[]a={-1,-2,-3,-4},转换成short[]b.问b[0]和b[1]分别是多少? 乍一看,这题不难,无非就是移位操作,再进行组合. ...

  10. MapReduce机制

    1. MapReduce是一种分布式计算模型,由Google提出,主要用于搜索领域,解决海量数据的计算问题.2. MR由两个阶段组成:Map和Reduce,用户只需要实现map()和reduce()两 ...