假设我的应用程序中有两个原色“模式”。
[data-theme="dark"] {
* {
background-color: black;
color: white;
}
}
[data-theme="light"] {
* {
background-color: white;
color: black;
}
}
以上CSS可以正常工作,但是任何修改都会迫使您复制粘贴或进行多余的更改。
我想要一些通用模板。
.palette(@color1, @color2) {
* {
background-color: @color1,
color: @color2,
}
}
并在以后像这样使用它
[data-theme="dark"] {
.palette(@backgroundDark, @textDark)
}
[data-theme="light"] {
.palette(@backgroundLight, @textLight)
}
这样,我可以重复使用模板并仅在一个地方进行编辑。我们可以用LESS做些什么吗?