少變量的作用域/上下文

我更少的代碼是這樣的：少變量的作用域/上下文

body { 
    @var: white; 

    &.blue { @var: blue; } 
    &.red { @var: red; } 
    &.abc { @var: #badass; } 

    background-color: @var; 
}

什麼，我希望是，如果body有類.abc變量@var的值是#badass，如果你有類.blue值爲blue依此類推。但這不是發生的事情，變量的價值不會獨立於他們的遺體類別而改變。

來源

2012-08-07 Oswaldo Acauan

怎麼應該知道什麼類你附加到你的身體標記？ – Amberlamps 2012-08-07 12:43:25

你試圖做的事情是不可能的！你正在用LESS創建一個CSS文件。這與你的HTML無關。 LESS怎麼知道你的身體標記在你的標記中分配了什麼類？ – Amberlamps 2012-08-07 12:54:23

我很困惑你的評論。 CSS/LESS知道我添加到自己身體的類，那不是我的問題。 – 2012-08-07 13:00:38

你需要創建一個參數的mixin：

.bg(@color){ 
    background-color:@color; 
}

然後將下面的代碼將工作：

body { 
    .bg("white"); 

    &.blue{ .bg("blue"); } 
    &.red { .bg("red"); } 
    &.abc { .bg(#bada55); } 

}

你在做什麼是不工作的，因爲你是重新分配變量 - 完美的工作，但不能爲課程寫出新的價值。（如果LESS創建新的規則，每次只是重新分配一個變量都是毫無意義的。）另外，與其他編程語言一樣，LESS也有範圍，因此當它達到background-color: @var;時@var的值爲white分配給它並據此創建規則。這下面的工作（但沒有任何意義）：

body { 
    @var: white; 

    &.blue{ @var: blue; background-color: @var;} 
    &.red { @var: red;  background-color: @var;} 
    &.abc { @var: #bada55; background-color: @var;} 
    background-color: @var; 
}

來源

2012-08-07 12:46:36 Christoph

我正在這樣做，但我想知道是否有可能在LESS中執行類似上述代碼的操作。但感謝回覆:) – 2012-08-07 12:48:46

@Oswaldo我編輯了我的答案，解釋了爲什麼你的嘗試不起作用。 – Christoph 2012-08-07 12:57:34

Thx，現在我明白了爲什麼不工作..我想這個範圍是在其他程序語言中給出的，像這樣的代碼： 'var abc ='white'; （'body'）。hasClass（'blue'））{abc ='blue'} $（'body'）。css（'background-color'，abc）;' – 2012-08-07 13:03:53

少變量的作用域/上下文

回答

相關問題