sass与less的区别

区别

1.语法不同

sass有两种语法格式
 

 1..scss为后缀名的嵌套写法
nav {
  $width: 100px;
  width: $width;
  color: $nav-color;
}

//-----------编译后
nav {
  width: 100px;
  color: #F90;
}
 2. 最早的缩进语法
 nav 
    width:100px;
    height:100px;
 编译后也是一样的
 
less的语法格式嵌套写法
  #header {
  color: black;
  .navigation {
    font-size: 12px;
  }
  .logo {
    width: 300px;
  }
}

2.变量的声明不同

sass使用 $
$highlight-color: #F90;
less使用 @
@nice-blue: #5B83AD;
@light-blue: @nice-blue + #111;

#header {
  color: @light-blue;
}

3.Mixin不同

sass的用法与JavaScript的函数是一样的,定义后直接使用 @include调用

  @mixin silly-links {
  a {
    color: blue;
    background-color: red;
  }
}
@include silly-links;
//编译后
a {
  color: blue;
  background-color: red; }

less就是定义一个类,然后直接当函数使用(less不提供定义函数)

.b-coloe {
    border: 4px solid red;
}
.box {
    .b-coloe();
    width: 100px;
    height: 200px;
    background-color: blue;
}
//编译后
.b-coloe {
  border: 4px solid red;
}
.box {
  border: 4px solid red;
  width: 100px;
  height: 200px;
  background-color: blue;
}
展开阅读全文

Windows版YOLOv4目标检测实战:训练自己的数据集

04-26
©️2020 CSDN 皮肤主题: 大白 设计师: CSDN官方博客 返回首页
实付0元
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值