//扩展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. Actors编程模型

    Actors模型(Actor model)首先是由Carl Hewitt在1973定义, 由Erlang OTP (Open Telecom Platform) 推广,其 消息传递更加符合面向对象的原 ...

  2. MS SQL 日常维护管理常用脚本

    --[查看数据库服务器名称] --默认实例查询 SELECT @@SERVERNAME AS SERVERNAME; SELECT SERVERPROPERTY('servername') AS Se ...

  3. 查看selinux的状态

    sh-4.1# getenforce Disabled sh-4.1# getenforce Disabled 永久方法 – 需要重启服务器 修改/etc/selinux/config文件中设置SEL ...

  4. 5.3日,7:20开始 阮一峰js的早课学习

    Infinity - Infinity // NaN Infinity / Infinity // NaN Infinity + Infinity // Infinity Infinity * Inf ...

  5. java 读写文件常用方法

    package study.bigdata; import org.apache.commons.io.FileUtils; import org.apache.commons.io.IOUtils; ...

  6. Unix系统编程()通用模型以外的操作ioctl

    之前学习到的都是通用的IO模型,现在要学的是一个ioctl系统调用,ioctl为执行文件和设备提供了一种多用途机制. int ioctl(int fd, int request, - /*argp*/ ...

  7. java 线程之间的协作 wait()与notifyAll()

    watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvbGlhbmdydWkxOTg4/font/5a6L5L2T/fontsize/400/fill/I0JBQk ...

  8. 谈谈对MVC、MVP和MVVM的理解

    刚出来工作的时候维护过一个老系统,该系统是用微软的ASP(Active Server Pages 动态服务器页面)写的.每一个页面都是一个ASP文件,每一个一个ASP文件中又同时包含了HTML.CSS ...

  9. 第一百四十节,JavaScript,封装库--浏览器检测

    JavaScript,封装库--浏览器检测 在函数库编写一个,浏览器检测对象 /** sys浏览器检测对象,对象下有两个属性,liu_lan_qi属性和xi_tong属性 * liu_lan_qi属性 ...

  10. php在linux中执行外部命令

    目录:一.PHP中调用外部命令介绍二.关于安全问题三.关于超时问题四.关于PHP运行linux环境中命令出现的问题 一.PHP中调用外部命令介绍在PHP中调用外部命令,可以用,1>调用专门函数. ...