CSS通过CSS变量支持这一点。

CSS文件示例

:root {
    --main-color:#06c;
}

#foo {
    color: var(--main-color);
}

关于工作示例，请参阅这个JSFiddle(该示例显示了小提琴中的一个CSS选择器将颜色硬编码为蓝色，另一个CSS选择器使用CSS变量，包括原始语法和当前语法，将颜色设置为蓝色)。

在JavaScript/客户端操作CSS变量

document.body.style.setProperty('--main-color',"#6c0")

所有现代浏览器都支持

Firefox 31+， Chrome 49+， Safari 9.1+， Microsoft Edge 15+和Opera 36+自带CSS变量支持。

如果你的系统上有Ruby，你可以这样做:

http://unixgods.org/~tilo/Ruby/Using_Variables_in_CSS_Files_with_Ruby_on_Rails.html

这是为Rails制作的，但请参阅下面如何修改它以独立运行。

通过编写一个小型Ruby包装器脚本，您可以独立于Rails使用这个方法 它与site_settings一起工作。rb，并将css路径考虑在内 你可以在每次你想重新生成CSS的时候调用它(例如在网站启动期间)

您可以在几乎任何操作系统上运行Ruby，因此这应该是相当独立于平台的。

例如，包装器:generate_CSS。rb(在需要生成CSS时运行此脚本)

#/usr/bin/ruby  # preferably Ruby 1.9.2 or higher
require './site_settings.rb' # assuming your site_settings file is on the same level 

CSS_IN_PATH  = File.join( PATH-TO-YOUR-PROJECT, 'css-input-files')
CSS_OUT_PATH = File.join( PATH-TO-YOUR-PROJECT, 'static' , 'stylesheets' ) 

Site.generate_CSS_files( CSS_IN_PATH , CSS_OUT_PATH )

site_settings中的generate_CSS_files方法。然后Rb需要修改如下:

module Site
#   ... see above link for complete contents

  # Module Method which generates an OUTPUT CSS file *.css for each INPUT CSS file *.css.in we find in our CSS directory
  # replacing any mention of Color Constants , e.g. #SomeColor# , with the corresponding color code defined in Site::Color
  #
  # We will only generate CSS files if they are deleted or the input file is newer / modified
  #
  def self.generate_CSS_files(input_path = File.join( Rails.root.to_s , 'public' ,'stylesheets') , 
                              output_path = File.join( Rails.root.to_s , 'public' ,'stylesheets'))
    # assuming all your CSS files live under "./public/stylesheets"
    Dir.glob( File.join( input_path, '*.css.in') ).each do |filename_in|
      filename_out = File.join( output_path , File.basename( filename_in.sub(/.in$/, '') ))

      # if the output CSS file doesn't exist, or the the input CSS file is newer than the output CSS file:
      if (! File.exists?(filename_out)) || (File.stat( filename_in ).mtime > File.stat( filename_out ).mtime)
        # in this case, we'll need to create the output CSS file fresh:
        puts " processing #{filename_in}\n --> generating #{filename_out}"

        out_file = File.open( filename_out, 'w' )
        File.open( filename_in , 'r' ).each do |line|
          if line =~ /^\s*\/\*/ || line =~ /^\s+$/             # ignore empty lines, and lines starting with a comment
            out_file.print(line)
            next
          end
          while  line =~ /#(\w+)#/  do                         # substitute all the constants in each line
            line.sub!( /#\w+#/ , Site::Color.const_get( $1 ) ) # with the color the constant defines
          end
          out_file.print(line)
        end
        out_file.close
      end # if ..
    end
  end # def self.generate_CSS_files

end # module Site

人们一直在为我的答案投票，但与“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

是的，在不久的将来(我在2012年6月写了这篇文章)你可以定义原生css变量，而不需要使用更少的/sass等!Webkit引擎刚刚实现了第一个css变量规则，所以Chrome和Safari的前沿版本已经可以使用它们了。查看官方Webkit (Chrome/Safari)开发日志和现场css浏览器演示。

希望在接下来的几个月里，我们可以看到浏览器对原生css变量的广泛支持。

由于支持，不要使用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.

我不清楚为什么不能使用PHP。然后，您可以根据需要简单地添加和使用变量，将文件保存为PHP文件，并链接到. PHP文件作为样式表，而不是.css文件。

它不一定是PHP，但你明白我的意思。

当我们需要编程的东西时，为什么不使用编程语言，直到CSS(可能)支持变量之类的东西?

还有，看看Nicole Sullivan的面向对象的CSS。