图像大小始终高于表格大小

问题描述 投票:0回答:1
email
1个回答
0
投票

除非您至少指定宽度或高度值,否则某些电子邮件客户端(例如 Outlook)将以原始分辨率显示图像。这是一个解决方案,

width="150" height="53"
适用于桌面,
style="max-width:150px; width:100%; height:auto;"
主要适用于移动客户端。

<table align="left" border="0" cellpadding="0" cellspacing="0" style="width: 100%;">
<tbody>
    <tr>
        <td align="center">
            <a href="x">
                <img src="https://mcusercontent.com/42504dec05e7e9f311428833a/images/51f59cb7-156c-5f86-2aa1-063260371792.jpg" alt="" width="150" height="53" style="max-width:150px; width:100%; height:auto;">
            </a>
        </td>
        <td align="center">
            <a href="x">
                <img src="https://mcusercontent.com/42504dec05e7e9f311428833a/images/612e5d3e-6c17-95d1-5535-229ac0cf8779.jpg" alt="" width="150" height="53" style="max-width:150px; width:100%; height:auto;">
            </a>
        </td>
        <td align="center">
            <a href="x">
                <img src="https://mcusercontent.com/42504dec05e7e9f311428833a/images/2bcfb68e-b795-87a9-e988-c486c57ced2c.jpg" alt="" width="150" height="53" style="max-width:150px; width:100%; height:auto;">
            </a>
        </td>
    </tr>

    <tr>
        <td align="center">
            <a href="x">
                <img src="https://mcusercontent.com/42504dec05e7e9f311428833a/images/68a6b8ca-36ea-e69c-be4f-7760413cfb93.jpg" alt="" width="150" height="53" style="max-width:150px; width:100%; height:auto;">
            </a>
        </td>
        <td align="center">
            <a href="x">
                <img src="https://mcusercontent.com/42504dec05e7e9f311428833a/images/979a39f1-5e41-e609-25e7-3fb34c57ab1f.jpg" alt="" width="150" height="53" style="max-width:150px; width:100%; height:auto;">
            </a>
        </td>
        <td align="center">
            <a href="x">
                <img src="https://mcusercontent.com/42504dec05e7e9f311428833a/images/089a7298-67a4-45fa-5937-c06b1f6021f7.jpg" alt="" width="150" height="53" style="max-width:150px; width:100%; height:auto;">
            </a>
        </td>
    </tr>
</tbody>
© www.soinside.com 2019 - 2024. All rights reserved.