less

* 
* */
/*
 * &        上一层的选择器
 */
#box {
  width: 500px;
  padding: 20px;
  border: 1px solid #f00;
  border: 5px solid #f00;
}
#box h2 {
  font: 20px/20px "微软雅黑";
}
#box p {
  color: green;
}
#box ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
#box ul li {
  height: 30px;
  background: #ccc;
}
#box ul li a {
  color: #f00;
}
#box ul li a:hover {
  color: blue;
}

@w:300px;
.box1{
    width: @w;
    height: @w+100;
    height: @w - 100;
    //* 在做减法运算的时候，一定要记着，减号前后要加上一个空格，不然就会报错
    
    border: 1px solid #f00;
    
    position: relative;
    left: @w*2;
    top: @w/3;
}
@width: 200px;
@height: 600px;
.box2{
    width: @width;
    height: @height;
    border: 1px solid #f00;
    
    div{
        width: @width/2;
        height: @height/2;
        background: green;
        
        margin: (@height - @height/2)/2 auto 0 auto;
        
        filter: ~‘alpha(opacity:50)‘;
        // *避免编译，就把不需要编译的内容前面先加上一个~，把内容放到一对引号中
    }
}