我正在设置一个单实例单数据库 Multi-Tenancy 应用程序。后端是用 Ruby on Rails 编写的，而前端是 AngularJS 中带有 Rails 框架的独立应用程序。
我使用对抽象父状态的解析来确定子域，然后是租户。确定租户后，我希望能够从前端的配置文件中读取 CSS 变量值，然后可以使用该值生成主要的 styles.css 文件，其中包含元素其余部分引用的类。
我听说可以使用 Sass 和 Less 等 CSS 预处理器来完成此操作，但我对这两者都没有经验，所以我一直在努力弄清楚如何进行设置。
一些帮助/代码示例将不胜感激 - 谢谢!
最佳答案
Sass 或 Less 不会真正做你想做的事，因为它们是在浏览器加载它们之前编译的。也就是说，浏览器只加载编译好的css文件。
不过，有几种方法可以实现您的目标。我不熟悉 Ruby，所以我会尽量让我的服务器语言建议保持通用。这些显然不是完整的解决方案，因为我不知道你的全部情况。相反，这些只是给你一些线索的一些想法。
可能最好的方法是使用服务器逻辑将不同的类应用于 body 标记，然后使用该类来确定将哪些样式应用于页面。例如:
/* probably a good idea to have fallback styles */
body {
color: black;
background: white;
}
body.style-one p {
color: red;
background: blue;
}
body.style-two p {
color: blue;
background: red;
}<body class="style-one">
<p>This text will be red.</p>当然，您也可以使用 javascript 更改 body 标记的类，因此用户可以更改页面的主题。
或者，您可以使用类似的服务器逻辑来写出辅助
<link rel="stylesheet"...>标记以引入一个或另一个样式表。这里的真正优势在于，如果您为各种主题制定了大量规则，则可以将它们很好地分开保存在自己的文件中。
我使用的最后一种方法(使用 php)是基于 GET 变量动态创建样式表，但将样式表打印为 css 文件。这种方法的缺点是我认为你失去了一些浏览器缓存优势。无论如何，这可能看起来像这样:
<?php
header("Content-Type: text/css");
if( $_GET['theme'] == 'one' ) {
echo 'p { color: red; }';
} else {
echo 'p { color: blue; }';
}
?>
a {
color: green;
}<link rel="stylesheet" href="style.css.php?theme=one">关于css - 如何根据子域设置可自定义的 CSS？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41667027/