快速入门
概览
变量（Variables）
混合（Mixins）
嵌套（Nesting）
运算（Operations）
转义（Escaping）
函数（Functions）
命名空间和访问符
映射（Maps）
作用域（Scope）
注释（Comments）
导入（Importing）
Less.js 用法
命令行用法
浏览器使用
Less.js选项
预装插件
程序化使用
API
Contributing to Less.js
Less 函数手册
逻辑函数
字符串函数
列表函数
数学函数
类型函数
其他功能
颜色定义函数
颜色通道函数
颜色操作函数
颜色混合函数
进阶指南
合并
父选择器
扩展
变量
Mixins
CSS Guards
Detached Rulesets
@import At-Rules
@plugin At-Rules
Maps (NEW!)
Less入门文档
网站首页
嵌套（Nesting）
Less 提供了使用嵌套（nesting）代替层叠或与层叠结合使用的能力。假设我们有以下 CSS 代码： ```less #header { color: black; } #header .navigation { font-size: 12px; } #header .logo { width: 300px; } ``` 用 Less 语言我们可以这样书写代码： ```less #header { color: black; .navigation { font-size: 12px; } .logo { width: 300px; } } ``` 用 Less 书写的代码更加简洁，并且模仿了 HTML 的组织结构。 你还可以使用此方法将伪选择器（pseudo-selectors）与混合（mixins）一同使用。下面是一个经典的 `clearfix` 技巧，重写为一个混合（mixin） (& 表示当前选择器的父级）： ```less .clearfix { display: block; zoom: 1; &:after { content: " "; display: block; font-size: 0; height: 0; clear: both; visibility: hidden; } } ``` 了解有关夫选择器的详细信息
上一篇：
混合（Mixins）
下一篇：
运算（Operations）
