通过magento中的内联css添加图像答案

【问题标题】：adding image through inline css in magento通过magento中的内联css添加图像
【发布时间】：2010-06-27 14:58:21
【问题描述】：

我正在尝试使用内联 css 开发一个小部件。内联 css 包含指向图像的链接，例如 {background:url(../img/transparent.png);} 我已将该文件夹复制到它的相对文件夹，但它不起作用。请提供任何帮助。我正在使用 magento 1.4+ 版。

【问题讨论】：

标签： css magento

【解决方案1】：

如果我猜对了，你正试图在你的 phtml 文件中使用你的一些皮肤图像“内联”。诀窍是调用正确的目录。如果我理解你的问题，正确的答案是：

<div style="background-image: url(<?php echo $this->getSkinUrl('img/transparent.png'); ?>)">Div content</div>

假设你的皮肤目录是

/skin/frontend/YOURTHEME/YOURVIEW/

然后上面的代码将在前端呈现：

<div style="background-image: url(http://YOURDOMAIN/skin/YOURTHEME/YOURVIEW/img/transparent.png)">Div content</div>

【讨论】：

【解决方案2】：

首先，使用background-image 而不是background because

使用速记属性时，属性值的顺序为：

背景色

背景图片

后台重复

背景附件

背景位置

如果这不起作用，请尝试在 Firefox 中右键单击小部件并选择“显示背景图像”。这应该会提示您如何解释相对路径，以及图像是否实际上位于该位置。

【讨论】：

【解决方案3】：

我认为您的问题在于尝试使用 '../images/image.jpg' 相对地到达图像 url，以及 magento 在呈现小部件时如何解释它..

为什么不尝试使用绝对路径，而不是沿着 '/app/code/local/widget/images/image.jpg' 行

【讨论】：