首页 > 代码库 > Less学习内容2

Less学习内容2

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;
 }

Less学习内容2