css 框架和配色方案

Question

我找不到可以让我插入自己的配色方案的 CSS 框架。

例如，在我当前的项目中，我导入了 blueprint/screen.css。 要更改字体的颜色，我必须更改 body { color..}、h2 { color..}、h3 {color..} 等。

是不是有一些东西可以提供不错的 css 默认值，但也可以使用配色方案？

Answer 1

它允许您在 CSS 中使用诸如变量之类的东西，这听起来正是您所追求的：

// LESS

@color: #4D926F;

#header {
  color: @color;
}
h2 {
  color: @color;
}

Answer 2

创建您自己的 CSS 文件，该文件在蓝图之后加载。 您需要重新定义所有内容，但蓝图默认值与浏览器默认值相差不远。

如果您有多种配色方案要快速切换，请在<html>标签上设置 class。 然后使用您的 CSS 文件为每个文件定义自定义 styles。

CSS：

.theme1 body {
    font-family: Tahoma;
    color: #500;
}

.theme2 body {
    font-family: Verdana;
    color: #050;
}

对于第一个主题：

<html class="theme1">

对于第二个主题：

<html class="theme2">

Answer 3

您不能只编辑 blueprint/screen.css 文件吗？ 您还可以使用 SASS 之类的东西，然后在样式表的顶部创建所有默认值，然后在呈现它时在整个样式表中使用 go。