CSS少加一個變量來選擇

我是一個不太新手只是想用它initally去除一些重複形成我stylessheets。我想添加一個變量（相對）複雜的選擇較少使用1.2.21下面的代碼：CSS少加一個變量來選擇

@current_house_id: 97; 
ul#house-family-menu li#[email protected]_house_id { 
    background: #8cb4e8 url(images/family-current.png) no-repeat 97% 50%; 
}

爲免生疑問，原來的CSS將是：

ul#house-family-menu li#menu-item-97 { 
    background: #8cb4e8 url(images/family-current.png) no-repeat 97% 50%; 
}

當我編譯這與lessc我得到錯誤：

Syntax Error: on line 268: expected one of [ (. # * - :: : @media @font-face , { ; got @ after: ul#house-family-menu li#menu-item-

我已經試過各種逃逸機制在這裏和其他地方的建議，但似乎沒有任何工作，perhaphs這不是更少的支持？如果不是，我想我可以在ul＃house-family-menu li＃menu-item上做一個不太平等的案例，並且每次只應用一個項目？

任何幫助非常感謝。

來源

2012-11-07 Jona

這沒有太大的意義了我。「@ current_house_id」何時改變？爲什麼不使用課堂？ – deceze

跨多個站點使用相同的樣式表，並且多個不同的選擇器引用該變量。另外，id號碼由wordpress菜單創建設置。 – Jona

我仍然建議你在問題的元素上使用*類*而不是動態地改變CSS。 – deceze

以下：

@b: 3; 

(~'[email protected]{b}') { 
    font-size: 20px; 
}

輸出：

.tester3 { 
    font-size: 20px; 
}

您的解決方案：

@current_house_id: 97; 
(~'ul#house-family-menu li#[email protected]{current_house_id}') { }

輸出：

ul#house-family-menu li#menu-item-97 { }

編輯：

1.4.0-β似乎已經改變了這個（http://lesscss.org/）：

(~"[email protected]{index}") { ...

選擇插值已被棄用，而是執行此

[email protected]{index} { ....

此外：

不能做選擇器插值，如預期（V1.5.0至少），如果選擇器是一個僞元件。開放式問題：https://github.com/less/less.js/issues/1294

解決方法：

.myMixin(@whichPseudo) { 
    @pseudo-selector: ~":@{whichPseudo}"; 
    &@{pseudo-selector} { 
     background: red; 
    } 
} 

#someEl1 { 
    .myMixin(before); 
} 

#someEl2 { 
    .myMixin(after); 
}

來源

2012-11-07 10:00:25 Patrick

CSS少加一個變量來選擇

回答

相關問題