1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  4. <head>
  5.   <meta charset="UTF-8">
  6.   <meta http-equiv="X-UA-Compatible" content="IE=edge">
  7.   <meta name="viewport"
  8.     content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum=1.0, user-scalable=no">
  9.   <title>Less</title>
  10.   <link rel="stylesheet" href="index.css">
  11. </head>
  13. <body>
  14.   <div class="box"></div>
  15. </body>
  17. </html>
/* @变量名称: 值; */

@bgc: red;
@box: .box;
@w: width;
@h: height;

@{box} {
  @{w}: 100px;
  @{h}: 100px;
  background-color: @bgc;
}

.box {
  width: 100px;
  height: 100px;
  background-color: red;
}

延迟加载

@color: red;
.box {
  color: @color;
    div {
      @color: blue;
      color: @color;
      @color: yellow;
  }
}

.box {
  color: red;
}

.box div {
  color: yellow;
}