好的，所以我为 mailchimp 买了一个主题，需要稍微修改一下供我个人使用。html 写在表格中。我的目标是页面标题（顶部表格）中的背景图像，以便在浏览器缩小到移动大小时调整大小。
到目前为止，我已经能够实现图像的缩小（通过使用将宽度设置为 100% 而不是设置高度），尽管当浏览器缩小到移动大小时，图像后面的紫色主体溢出图像下方（就像这个 https://i.stack.imgur.com/dCRK5.png），当根本不想看到任何背景时。除此之外，在缩小时，我正在尝试获取标题、文本和阅读更多按钮以缩小图像，并隐藏徽标和所有顶部链接。
我尝试过使用最大高度和最大宽度，将溢出设置为隐藏，并尝试使用div 容器而不是表格重新做整个事情，但它变得太复杂了。我对javascript或jquery一无所知，所以最好使用html/css解决方案。
这是我试图缩小的主要部分的代码 -
<table border="0" align="center" width="800" cellpadding="0" cellspacing="0" class="container800">
<tr>
<td align="center" style="background-image: url(http://pickedmail.com/mira/img/main-bg.png); background-size: 100%; background-position: top center; background-repeat: repeat;" background="http://pickedmail.com/mira/img/main-bg.png">
<table border="0" align="center" width="590" cellpadding="0" cellspacing="0" class="container590 bodybg_color">
<tr><td height="30" style="font-size: 30px; line-height: 30px;"> </td></tr>
<tr>
<td>
<table border="0" align="left" cellpadding="0" cellspacing="0" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="container590">
<tr>
<td align="center">
<table border="0" cellpadding="0" cellspacing="0" align="center">
<tr><td height="5" style="font-size: 5px; line-height: 5px;"> </td></tr>
<tr>
这是JSFIDDLE中的完整内容 - https://jsfiddle.net/jackgenesin/2zzkrqzf/
任何帮助表示赞赏，请随时告诉我它的方式太复杂了，无法纯粹用html/css完成哈哈，谢谢
紫色的身体与图像无关。这是来自小提琴中第一个<table>标签中的bgcolor="8a5a8d"。你可以消除它，颜色就会消失。
使用您发布的代码，您可以在前两个 <table> 标记中声明明确的像素宽度。这会告诉浏览器不应调整这些大小。您需要使用相对维度（例如 100%）来执行此操作。最好还是添加这个css："style="max-width=800px;"，这样桌面上的表格就不会变得太大。
由于您有嵌套表来制作此布局（许多电子邮件客户端仍然需要），因此要真正阻止标题图像溢出到邮件正文中，您必须一个接一个地创建两组嵌套表。如果工作量太大，请将 background-size: 参数更改为 cover 。这将拉伸图像以填充背景，如果需要，可以裁剪边缘以使所有内容适合。
最后，要真正实现您想要的一切，使用自动隐藏徽标和缩小菜单，您需要使您的模板响应。看看免费的 mailchimp 模板，了解您可以为此重复使用的代码。
你必须在HTML/CSS中完成所有这些工作，因为你不能依赖允许javascript的电子邮件客户端。