less小记

发表于 更新于 阅读次数： 本文字数： 444 阅读时长 ≈ 1 分钟

嵌套选择器

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
body {
  color: #333;
  .main {
      background: #eee;
      p {
          color: #666;
      }
  }
}
## 变量
### 表示值的变量
```less
@var1: #fff;
body {
  color: @var1;
}

表示选择器的变量

1
2
3
4
@my-selector: banner;
.@{my-selector} {
  color: #fff;
}

字符串变量

1
2
3
4
5
6
7
@imgPath: "/path/to/bg.png";
.bg {
  background: url('@{imagePath}');
}
.bg2 {
  background: url('append/url/@{imagePath}');
}