Less语言特性 – 变量范围

变量范围指定可用变量的位置。 变量将从本地作用域搜索，如果它们不可用，则编译器将从父作用域搜索。

这就好比js里面的原型链一般，使用某一个方法，先在该对象上面寻找，如果找不到，顺着原型链往上找，指导原型链的顶端找不到为止。而这里只是向父级作用域寻找，没说会一直寻找下去。

两个观点：

• 变量先从本地搜索
• 本地没有再从父级作用域搜索

下面的例子只是为了演示用，一般情况，提前把变量定义好，不要在内部定义，不然容易造成代码混乱。

示例

index.html

    





        

            
左侧内容
            
右侧内容
        
    

index.less

@fontSize: @f;
@f: 20px;

@fontColor: red;

.container {
    font-size: @fontSize; // 10px
    @f: 10px;

    @fontColor: blue;
    color: @fontColor; // blue

}