通过LESS和CSS动态地(在运行时)更改变量？

Question

@myThemeBackground = #ddd;  

div#box1 { background: @myThemeBackground; }  

我正在使用LESS以便为我的css使用变量.它工作正常,但我想知道是否有办法让我在运行时通过javascript或其他东西动态更改"myThemeBackground".

因此,如果用户为背景选择自定义颜色,我希望整个皮肤都要改变.

注意:这是为了动态地对应用程序进行设置/换肤,例如用户选择背景颜色,然后整个应用程序更改(不刷新页面)

Answer 1

您可以使用modifyVars方法动态修改Less变量:

less.modifyVars({ myThemeBackground : '#000' });

Answer 2

我能想到的唯一解决方案是更改使用 less.js 呈现的文本：

less.refreshStyles()

更改文件中或较少的样式片段中的文本。

在这里阅读更多相关内容： 动态加载 less.js 规则