css - 在 CakePHP 的 CSS 文件中如何处理 URL，以便它们引用正确的位置？

Question

我正在设计一个经常使用 CSS 文件的网站，但我有几次出现背景图像、列表中的元素符号图像，我可能会发现另一个需要 css url() 函数。

但是，在 cake 中，所有 URL 都应该由 Route::url() 函数处理，有几种方式，最常见的是 $html->url()

但我的问题是 CSS 文件不由 PHP 解释。我如何创建一个包含类似内容的 CSS 文件:

div.coolbg {
  background-image: url('<?= $html->url("/img/coolbg.jpg") ?>');
}

看，我的最后一个选择是在布局上内联导入 css 文件，以便对其进行解释。但我非常喜欢使用更“蛋糕”的方法。

谢谢!

Answer 1

您不需要在您的 css 文件中使用 $html->url()，因此您不需要通过 PHP 解析 CSS 文件或创建一个 CssController。

如果您的蛋糕应用程序安装在您的虚拟主机 DocumentRoot 中，只需将所有从 webroot 到图像的路径设置为绝对路径。例如

div.coolbg {
  background-image: url(/img/coolbg.jpg);
}

这会将 app/webroot/img/coolbg.jpg 中的图像应用到您的

如果您的蛋糕应用未安装在虚拟主机 DocumentRoot 中，即您通过类似 http://www.domain.com/myapp/ 的 URL 访问您的蛋糕应用, 然后你创建相对于 css 文件的图像路径。查看 app/webroot/css/cake.generic.css 中的样式规则，例如

#header h1 {
background:#003D4C url(../img/cake.icon.gif) no-repeat scroll left center;
color:#FFFFFF;
padding:0 30px;
}

这是可行的，因为样式表位于 app/webroot/css/目录中，图像位于 app/webroot/img/目录中，所以路径“../img/cake.icon.gif”出现了css 目录，然后回到 img 目录。