CSS、Sass、Scss、Less 语法标准

变量方法

$      => SCSS, SASS
--     => CSS
@      => LESS

CSS 语法

--primaryColor: #ffffff;
--width: 800px;

body {
    width: var(--width);
    color: var(--primaryColor);
}
.content{
    width: var(--width);
    background: var(--primaryColor);
}

Sass 语法

$font-color: #fff
$bg-color: #00f

#box
  color: $font-color
  background: $bg-color

Scss 语法

$font-color: #fff;
$bg-color: #00f;

#box{
  color: $font-color;
  background: $bg-color;
}

Less 语法

@primarycolor: #ffffff;
@width: 800px;

body{
 width: @width;
 color: @primarycolor;
 .content{
  width: @width;
  background:@primarycolor;
 }
}