将数据传递给动态 CSS 文件？答案

【问题标题】：Passing data to dynamic CSS file?将数据传递给动态 CSS 文件？
【发布时间】：2012-08-09 15:04:39
【问题描述】：

这更多的是浏览器会做什么的问题，而不是后端架构的问题。

我正在使用 codeigniter 并设置了一个控制器来处理资产（CSS、JS 和图像），目前我只是从 CSS 文件中处理 PHP 并将它们呈现为 CSS文件到浏览器，因此www.mysite.com/asset/home.css 将调用资产类并从单个文件生成主页的 CSS 文件。

我想让对 CSS 文件的请求更加动态，以便请求将确定应该合并的多个文件，然后传递给 less.php 进行解析和最小化。

考虑到缓存问题，将变量传递给 CSS 类的最佳方法是什么？平面链接 URI 变量？传统的 GET URI？我可以使用数据库为其组件引用一个给定的名称，但这不是很多开销吗？

欢迎任何想法或意见！

++ 浏览器如何处理standard.menu.comments.css 之类的东西？

+++ 我最终将 URI 字符串附加到文件中。它不像我想要的那样干净，但它似乎正在工作。我可能很快就会使用平斜杠分隔的 URI 解析器来清理请求行。感谢您的帮助！

【问题讨论】：

就像你说的一个主要问题是缓存。浏览器喜欢缓存 CSS 文件之类的东西，以便让用户更快地完成。使用动态样式表可能会导致不需要的结果。只是一个警告。
我没用过codeigniter，但是如果你能改变链接样式表的代码，你可以用随机查询技巧来对抗客户端缓存：<link rel="stylesheet" href="style.css?r=<?php echo rand(); ?>">
我不一定反对缓存，我只是想确保如果我附加一个 URI，浏览器会将其作为 css 文件缓存标题的一部分。所以home.css?page=comments 与home.css?page=video 不一样。
@anstosa 会杀死所有缓存，这可能并不理想
@Prescott 不理想，但有时是必要的，因为某些浏览器（Chrome）实际上不再遵守过期标头......但是该策略有效的事实意味着是的，BayssMenkanique，这两个资源将被认为是独一无二的。

标签： php css codeigniter cross-browser less

【解决方案1】：

您可以使用以下标题创建文件style.php：

<?php header("Content-type: text/css"); ?>

并在您的模板中链接此样式：

<link rel="stylesheet" type="text/css" media="screen" href="style.php?color=red">

然后您可以在style.php 中导入一些样式表：

@import ("someStyle.css");

或者您可以传递一些$_GET 变量并创建条件样式：

<?php 
    if ($_GET['color'] == 'red')
    {
        echo ".myBlock {background: #ff0000;}";
    } 
    else
    {
        echo ".myBlock {background: #00ff00;}";
    }
?>

如果您只是不想缓存 .css 文件，请将随机 $_GET 变量附加到您的链接样式：

<link rel="stylesheet" type="text/css" media="screen" href="style.css?<?php echo time(); ?>">

【讨论】：

就像我说的，问题不在于创建文件。它正在弄清楚如何最好地传递数据。您是否建议 GET 仍然是缓存的最佳方式？
这是创建动态样式表的唯一方法。 CSS 本身是静态的。加载适当样式的最佳方法是使用单独的 .css 文件并在需要的地方加载它们。
基本上没关系，如果你用一些不必要的类加载.css。无需为每个页面创建单独的.css。
创建它们的方法肯定不止一种，我只是在寻找最适合浏览器的方法。您推荐的方法调用 .php 文件，该文件在 Moz 和 WK 中运行良好，但在 IE 中中断。我认为 GET 将是最好的方法。
较新版本的 IE(9) 不发送 Accept: text/css; */* 而是发送 Accept: text/css;，因此 Apache 以 406 错误响应，因为它不知道如何处理 php 文件。您必须将其作为 .css 文件请求，并且强制 Apache 处理 .css 文件，或者接受作为 URI 变量并从那里编写文件（就像我正在做的那样）。