我正在处理一个相当长的CSS文件。我知道客户可能会要求更改配色方案，并想知道:是否可以将颜色分配给变量，这样我就可以更改一个变量，使新颜色应用于所有使用它的元素?
请注意，我不能使用PHP动态更改CSS文件。
当前回答
如果将css文件编写为xsl模板，则可以从简单的xml文件中读取颜色值。然后使用xslt处理器创建css。
colors.xml:
<?xml version="1.0"?>
<colors>
<background>#ccc</background>
</colors>
styles.xsl:
<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="text" version="1.0" encoding="iso-8859-1"/>
<xsl:template match="/">body {
background-color: <xsl:value-of select="/colors/background" />;
}
</xsl:template>
</xsl:stylesheet>
渲染css样式的命令:xsltproc -o styles.css styles。xsl colors.xml
styles: css
body {
background-color: #ccc;
}
其他回答
你可以试试CSS3变量:
body {
--fontColor: red;
color: var(--fontColor);
}
CSS本身不使用变量。但是，你可以使用另一种语言，比如SASS，用变量来定义你的样式，并自动生成CSS文件，然后你可以把它放在网上。注意，每次对CSS进行更改时都必须重新运行生成器，但这并不难。
没有简单的CSS解决方案。你可以这样做:
在CSS文件中找到background-color和color的所有实例，并为每个独特的颜色创建一个类名。 .top-header {color: #fff;｝ .content-text {color: #f00;｝ .bg-leftnav {background-color: #fff;｝ .bg-column {background-color: #f00;｝ 接下来，浏览网站上涉及到颜色的每个页面，并为颜色和背景色添加适当的类。 最后，删除CSS中除了新创建的颜色类之外的任何颜色引用。
你可以对选择器进行分组:
#selector1, #selector2, #selector3 { color: black; }
如果将css文件编写为xsl模板，则可以从简单的xml文件中读取颜色值。然后使用xslt处理器创建css。
colors.xml:
<?xml version="1.0"?>
<colors>
<background>#ccc</background>
</colors>
styles.xsl:
<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="text" version="1.0" encoding="iso-8859-1"/>
<xsl:template match="/">body {
background-color: <xsl:value-of select="/colors/background" />;
}
</xsl:template>
</xsl:stylesheet>
渲染css样式的命令:xsltproc -o styles.css styles。xsl colors.xml
styles: css
body {
background-color: #ccc;
}
