我正在构建一个HTML5 App,需要用户使用不同的皮肤。我很想听听SASS最好的解决方法。我是SASS的新手,这个解决方案有效但必须有更好的方法。该方法适用于我确定不需要的额外课程。
我的想法是编译并发送两个css文件,然后让用户选择一个选择标记。
有什么建议吗?
这是我现在使用的一些示例代码:
“mixin”_skin.scss
$skin: default-skin; // Default skin
//$skin: dark-skin; // Dark skin
.default-skin { // Default Skin
@import 'skins/_default-skin';
}
.dark-skin { // Dark Skin
@import 'skins/dark-skin';
}
// Applying the Skins
html {
@if $skin == default-skin {
@extend .default-skin;
} @else if $skin == dark-skin {
@extend .dark-skin;
} @else {
@extend .default-skin;
}
}
默认皮肤部分
.nav{
background: $gray-light;
button{
color: $white;
&:active{
color: $gray-lighter;
}
}
}
黑皮肤部分
.nav{
background: $gray-darker;
button{
color: $black;
&:active{
color: $gray-dark;
}
}
}