less学习-混合

在 LESS 中我们可以定义一些通用的属性集为一个class，然后在另一个class中去调用这些属性. 下面有这样一个class:

.bordered {
  border-top: dotted 1px black;
  border-bottom: solid 2px black;
}

        

          
        
        
        

          

          AI 代码解读
        
      
      

那如果我们现在需要在其他class中引入那些通用的属性集，那么我们只需要在任何class中像下面这样调用就可以了:

#menu a {
  color: #111;
  .bordered;
}
.post a {
  color: red;
  .bordered;
}

        

          
        
        
        

          

          AI 代码解读
        
      
      

.bordered class里面的属性样式都会在 #menu a 和 .post a中体现出来:

#menu a {
  color: #111;
  border-top: dotted 1px black;
  border-bottom: solid 2px black;
}
.post a {
  color: red;
  border-top: dotted 1px black;
  border-bottom: solid 2px black;
}

        

          
        
        
        

          

          AI 代码解读
        
      
      

任何 CSS class, id 或者 元素 属性集都可以以同样的方式引入.

欢迎访问我的个人博客–付博瀚的个人博客