Html CSS背景图像没有响应

嗨，我正在尝试创建一个响应电子邮件模板

我无法使背景图像响应

以下是图像代码的示例：

a#learn-more {  background-size: 100%; display: block; background: url('http://tophitechgadgets.com/wp-content/uploads/2013/11/learn-more.png')no-repeat; height: 68px; width: 600px; margin: 0 auto; }

基本上，我们有以下图片，我很难使流体（响应） -徽标（a#了解更多信息） -条幅图像（.banner img） -了解更多按钮（a#了解更多） -图1和图2

我这里有我的演示：

希望您可以编辑代码，看看我的问题是什么，为什么我不能使他们响应

---

我真的被困在这里了。

你可以使用一个不同的div进行绝对定位，并在其中包含具有百分位宽度和高度的图像，因此当屏幕大小改变时，div（以及其中的图像）也会调整大小。只要用z-index将div放在所有内容下面，就可以了。

电子邮件客户端，如Outlook（-Express）、Mail（OSX）等，都使用不同的html引擎，并且有很多限制。尤其是Outlook似乎使用了有限的基于IE6的渲染引擎。css类的背景图像和样式不起作用，而且忘记了绝对或相对定位

确保模板在这些电子邮件客户端中看起来也不错，除非你只针对移动电子邮件客户端（它们似乎支持所有这些）

请查看位于的标准指南（html/css）。

您可以通过以下内容进行改进，但正如@Willem所说，如果制作电子邮件模板，您确实需要改变方法。许多电子邮件客户端完全删除

标题

，并删除样式。有些支持有限的一组用于格式化的内联样式，而不支持用于布局的内联样式。事实上，使用内联样式的老式表格布局通常是最好的方式

您可能会发现其中一些方法很有用：

至于充分利用你目前所拥有的：

您的

.divider

和

.banner img

元素被设置为600px宽。 将它们设置为100%

不要将横幅作为背景图像

将

.lpanel

和

.rpanel

图像的大小调整为父级图像的100% 宽度

---

演示：

什么是关于

宽度的响应：600px；高度：253px；背景：url（'http://tophitechgadgets.com/wp-content/uploads/2013/11/img-banner.png）

？-如果需要响应，请删除高度和宽度，让服务器为较小的设备提供较小的图像。请详细说明“响应”的含义。如果你的意思是它有一个动态的宽度取决于家长的宽度，那么你应该删除高度：68px；宽度：600px；我的意思是让背景图像也流畅。我已经使一些元素流体只需要使背景图像，包括标志，横幅，了解更多等流体。如果您可以检查jsfiddle上的代码，您会发现有一些代码可能需要调整，以使其在较小的屏幕上看起来更好。我真的被困在这里了。