Less学习内容2

Posted 2020-09-23

Less嵌套的规则

在我们书写标准 CSS 的时候，遇到多层的元素嵌套这种情况时，要么采用从外到内的选择器嵌套定义，要么采用给特定元素加 CLASS 或 ID 的方式。

<div id="home">
 <div id="top">top</div>
 <div id="center">
 <div id="left">left</div>
 <div id="right">right</div>
 </div>
 </div>

a {
 color: red;
 text-decoration: none;
 &:hover {
  color: black;
  text-decoration: underline;
 }
 }

经过编译生成的 CSS 文件如下：

 

 a {
 color: red;
 text-decoration: none;
 }
 a:hover {
 color: black;
 text-decoration: underline;
 }