Less 技巧

Less 已经变得的非常重要的，这里写一些官方文档中没有重点介绍，但是很实用的使用方法。

1. 嵌套

Less 提供了使用嵌套（nesting）代替层叠或与层叠结合使用的能力。假设我们有以下 CSS 代码：

#header {
  color: black;
}
#header .navigation {
  font-size: 12px;
}
#header .logo {
  width: 300px;
}

用 Less 语言我们可以这样书写代码：

#header {
  color: black;
  .navigation {
    font-size: 12px;
  }
  .logo {
    width: 300px;
  }
}

可以使用&来代替父元素

#header {
  color: black;
  .navigation {
    font-size: 12px;
  }
  // 只有当前下的.logo 才有效果。
  & > .logo {
    width: 300px;
  }
}