other.css

.box1 .box2 {
  color: red;
}
.box1 > .box3,
.p2 {
  color: red;
}
.box1 > .box3:hover {
  color: blue;
}
.box1:hover {
  color: orange;
}
div .box1 {
  width: 100px;
}
.p1 {
  width: 100px;
  height: 200px;
}
.p2 {
  color: red;
}
.p3 {
  width: 100px;
  height: 200px;
}
.p5 {
  width: 100px;
  height: 100px;
  background-color: #bfa;
}
div {
  width: 300px;
  height: 100px;
  border: 1px red solid;
}
span {
  color: #800080;
}
html {
  width: 100%;
  height: 100%;
}
body {
  width: 100%;
  height: 100%;
  background-color: #bfa;
}
body:hover {
  background-color: #22aa00;
}
main {
  width: 200px;
  height: 100px;
  border: 1px red solid;
}
.box1 {
  width: 150px;
  height: 100px / 2;
  background-color: #bfa;
}
/*
    如何建立.less文件与.css文件行与行之间的对应关系
        - 因为有时候要使用浏览器进行调试，如果不进行配置，出错时提示的是.css文件中的第几行。通过自行配置，可以将浏览器报错时的提示改为.less的第几行
        - .css.map这个文件就建立了.less文件与.css文件行与行之间的对应关系
        - 配置地址
            - 设置->扩展->Easy LESS Configuration->在settings.json中编辑
*/
/*# sourceMappingURL=./other.css.map */