快速入门
概览
变量(Variables)
混入(Mixins)
嵌套(Nesting)
运算(Operations)
转义(Escaping)
函数(Functions)
命名空间和访问符
映射(Maps)
作用域(Scope)
注释(Comments)
导入(Importing)
使用 Less.js
命令行用法
浏览器使用
Less.js选项
预加载插件
程序化使用
API
为 Less.js 做贡献
Less 函数手册
逻辑函数
字符串函数
列表函数
数学函数
类型函数
杂项函数
颜色定义函数
颜色通道函数
颜色操作函数
颜色混合函数
进阶指南
变量
父选择器
继承
合并
Mixins
CSS Guards
分离规则集
@import At-Rules
@plugin At-Rules
Maps (NEW!)
作用域
命名空间和访问符 - Less入门文档 - 笔下光年
网站首页
命名空间和访问符
(不要和 [`CSS @namespace`](https://www.w3.org/TR/css3-namespace/ "`CSS @namespace`") 或 [`namespace selectors`](http://www.w3.org/TR/css3-selectors/#typenmsp "`namespace selectors`") 混淆了)。 有时,出于组织结构或仅仅是为了提供一些封装的目的,你希望对混入(mixins)进行分组。你可以用 Less 更直观地实现这一需求。假设你希望将一些混入(mixins)和变量置于 `#bundle` 之下,为了以后方便重用或分发: ```less #bundle() { .button { display: block; border: 1px solid black; background-color: grey; &:hover { background-color: white; } } .tab { ... } .citation { ... } } ``` 现在,如果我们希望把 `.button` 类混入到 `#header a` 中,我们可以这样做: ```less #header a { color: orange; #bundle.button(); // 还可以书写为 #bundle > .button 形式 } ``` 注意:如果不希望它们出现在输出的 CSS 中,例如 `#bundle .tab`,请将 () 附加到命名空间(例如 `#bundle()`)后面。
上一篇:
函数(Functions)
下一篇:
映射(Maps)