如何在一个样式表中添加多个颜色方案在HTML中？

Question

我想知道如何在一个样式表中添加多个配色方案，这些样式表可以像wordpress，magento等一样工作。其中主题在不同颜色的商店中可用。

Answer 1

通过切换body元素上的类来交换颜色方案。在CSS中为您使用颜色方案更改的所有元素引用此类的多个版本。

body.colorscheme-dark {
    /* Changes that are inheritable */
    color: #fff;
}

body.colorscheme-dark #content #comment-section {
    /* Specific changes to this element */
    border-color: whitesmoke;
}

你可以创建这样的无限方案。

现在用这样一个简单的函数来改变它们：

function swapTheme(theme) {
    $(body).removeClass().addClass(theme);
}

为了清晰起见，jQuery只是评论你是否喜欢在香草js。