人们一直在为我的答案投票，但与“sass”或“less”的乐趣相比，这是一个糟糕的解决方案，特别是考虑到现在这两种方法都有很多易于使用的gui。如果你还有理智，就忽略我下面的建议吧。

你可以在css中每个颜色之前放一个注释，作为一种变量，你可以使用查找/替换来改变它的值，所以…

在css文件的顶部

/********************* Colour reference chart****************
*************************** comment ********* colour ******** 

box background colour       bbg              #567890
box border colour           bb               #abcdef
box text colour             bt               #123456

*/

后面的CSS文件

.contentBox {background: /*bbg*/#567890; border: 2px solid /*bb*/#abcdef; color:/*bt*/#123456}

然后，例如，改变框文本的配色方案，你做一个查找/替换

/*bt*/#123456

编辑:这个答案不再是最新的。你现在应该使用CSS变量。

考虑使用SCSS。它与CSS语法完全兼容，因此有效的CSS文件也是有效的SCSS文件。这使得迁移很容易，只需要更改后缀。它有许多增强，最有用的是变量和嵌套选择器。

在将其发送到客户端之前，需要通过预处理器将其转换为CSS。

多年来，我一直是一名铁杆CSS开发人员，但自从强迫自己用SCSS做项目以来，我现在不会使用其他任何东西。

由于支持，不要使用css3变量。

如果你想要一个纯css解决方案，我会做以下事情。

Use color classes with semenatic names. .bg-primary { background: #880000; } .bg-secondary { background: #008800; } .bg-accent { background: #F5F5F5; } Separate the structure from the skin (OOCSS) /* Instead of */ h1 { font-size: 2rem; line-height: 1.5rem; color: #8000; } /* use this */ h1 { font-size: 2rem; line-height: 1.5rem; } .bg-primary { background: #880000; } /* This will allow you to reuse colors in your design */ Put these inside a separate css file to change as needed.

你可以试试CSS3变量:

body {
  --fontColor: red;
  color: var(--fontColor);
}

dicejs.com(正式形式为cssobjs)是SASS的客户端版本。您可以在CSS中设置变量(存储在json格式的CSS中)，并重用您的颜色变量。

//create the CSS JSON object with variables and styles
var myCSSObjs = {
  cssVariables : {
    primaryColor:'#FF0000',
    padSmall:'5px',
    padLarge:'$expr($padSmall * 2)'
  }
  'body' : {padding:'$padLarge'},
  'h1' : {margin:'0', padding:'0 0 $padSmall 0'},
  '.pretty' : {padding:'$padSmall', margin:'$padSmall', color:'$primaryColor'}
};

//give your css objects a name and inject them
$.cssObjs('myStyles',myCSSObjs).injectStyles();

这里有一个完整的可下载演示的链接，这比他们的文档更有帮助:dicejs演示

仅靠CSS是不可能实现的。

你可以使用JavaScript，也可以使用LESS .js，这将把LESS变量实时呈现到CSS中，但它仅用于开发，并且为实际使用增加了太多的开销。

你可以使用CSS最接近的是使用属性子字符串选择器，像这样:

[id*="colvar-"] {
    color: #f0c69b;
}

并设置您想要调整为以colvar-开头的名称的所有元素的id，例如colvar-header。然后，当您更改颜色时，所有ID样式都会更新。这是你单独使用CSS所能达到的效果。