less.css文件共享變量

我使用less.css來簡化我的CSS樣式。我想在少一個文件中聲明一個變量，並在我的許多少文件中分享它的用法。這可能嗎？例如：less.css文件共享變量

english.less

@languageFloat：左;

chart.less

div#footer a.web 
{ 
    display: block; 
    float: @languageFloat; 
    color: #cccccc; 
    margin-right: 10px; 
}

來源

2011-10-13 vondip

做到這一點，最好的辦法是@import你的LESS文件與它所有的變量。下面是爲@import關鍵字的語法：

// For LESS file includes, 
@import "lib.less"; 
// or 
@import "lib"; // infers the .less extension 

// and for plain CSS includes which are added but not parsed by LESS 
@import "style.css";

，如果你成爲CSS文件到您的用戶此效果特別好（而不是在瀏覽器內less.js解析），因爲@import聲明會加劇你的LESS和CSS文件合併成一個CSS文件。也許你可以考慮讓一個控制器的LESS文件包含你的變量，然後是你的其他LESS和CSS文件，以便最終的結果是你爲瀏覽器提供的一個文件。

我想這會是這樣簡單的東西：

// Controller.less 
@import "english.less"; 
@import "chart.less";

來源

2011-10-13 17:51:48

有趣的是，雖然我需要共享一個有條件的css文件，英語可以用德語，俄語等替換。我可以有條件地導入css庫嗎？ – vondip

有趣的是，我從你最初的問題不理解這個問題。 LESS沒有條件陳述（尚未），所以你必須以聲明的方式思考。製作'englishContainer.less'文件，導入'english.less'和'chart.less'，然後導入'german.less'和'chart.less'等的'germanContainer.less'文件，這可能是去做吧。 –

//例如BlueTheme.less以下文件---------
@import "DefaultBlueParameters.less"; < ---唯一的主題少瓦爾

@import (less) "DefaultBase.css"; < ---有使用DefaultBlueParameters.less vars

它產生BlueTheme.css

來源

2017-09-22 11:27:32

歡迎來到StackOverflow並感謝您的幫助。你可能想通過添加一些解釋來讓你的答案更好。 –

less.css文件共享變量

回答

相關問題