Yii2 资产：如何在 CSS 文件中使用图像资产？

Question

我想创建一个包含AssetBundle 的扩展，它提供了一个简单的静态 CSS 文件。在那个静态 CSS 文件中，我想使用一个图像文件，它也是扩展的一部分。

如何知道图像文件的 URL，以便在 CSS 文件中使用它？

如果我将图像文件注册为资产，它将获得一个我们无法预测的随机 URL！所以不可能做这样的事情：

.some-selector { background: url('/assets/?????/image.jpg'); }

那么，如何做到这一点呢？

---

为了进一步说明，以下是此类扩展的示例文件夹结构：

• extension/Widget.php - 一些注册我们 AssetBundle 的小部件
• extension/AssetBundle.php - 注册 css 的资产包
• extension/assets/css/style.css - CSS
• extension/assets/images/image.jpg - 我们要在 style.css 中使用的图像

Answer 1

在这种情况下，我建议在资产定义中也包含一个新的 css 文件。在这种情况下，图像和 css 文件将位于 assets 文件夹中，您可以指定相对路径，而不是绝对路径。 例如 /assets/a4dc56/image.jpg

/assets/a4dc56/style.css 包含以下内容：

.some-selector {
    background: url('image.jpg');
}