Less-继承

最新推荐文章于 2024-08-25 20:32:05 发布

「已注销」

最新推荐文章于 2024-08-25 20:32:05 发布

阅读量770

点赞数

分类专栏： css预处理器 web前端开发文章标签： less 继承混合

本文链接：https://blog.youkuaiyun.com/weixin_44713430/article/details/102239971

版权

web前端开发同时被 2 个专栏收录

122 篇文章

订阅专栏

css预处理器

10 篇文章

订阅专栏

less中的继承和less中混合的区别

使用时的语法格式不同 (选择器:extend(混合))
转换之后的结果不同(混合是直接拷贝, 继承是并集选择器)

.center{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.father:extend(.center){
  width: 300px;
  height: 300px;
  background: red;
  //.center;
  .son:extend(.center){
    width: 200px;
    height: 200px;
    background: blue;
    //.center;
  }
}