0

我需要制作基于表格的布局并将表格宽度设为 550 像素。然后我加载了一个原始宽度为 550 像素的图像，但在浏览器上我只有 449 像素。我想全宽。而且我在单元格之间还有额外的空间。

<table style="width:550px;margin:0 auto;" cellspacing="0" cellpadding="0" border="0">
            <tr style="margin:0; padding:0;">
                <td style="font-size:12px; line-height: 12px; width: 100%; text-align: right; color:#5A99B1;">Click <b>here</b> for the online version</td>
            </tr>
            <tr>
                <td style="width:100%; height:10px;" cellspacing="0" cellpadding="0">
                    <img style="width: 100%;" src="border-top.png" />
                </td>
            </tr>
            <tr>
                <td style="width:50%; background-color:white;">
                    <img src="brugadalogo.png" />
                </td>
                <td style="width:50%; background-color:white; text-align: right;">
                    <img src="msdlogo.png" />
                </td>
            </tr>
        </table>
4

1 回答 1

1

您的表格列不均匀。您有 3 行，前 2 行有 1 列，最后一行有 2 列。即使你有正确的百分比，最好让它均匀分布。例如让所有 3 行都有或“占用”2 列的空间。

我的意思是，您应该使用colspan. 还要从图像中删除宽度，如果你想要它的原始大小，它应该默认得到它。

<table style="width:550px;margin:0 auto;" cellspacing="0" cellpadding="0" border="0">
            <tr style="margin:0; padding:0;">
                <td **colspan="2"** style="font-size:12px; line-height: 12px; text-align: right; color:#5A99B1;">Click <b>here</b> for the online version</td>
            </tr>
            <tr>
                <td **colspan="2"** style="height:10px;" cellspacing="0" cellpadding="0">
                    <img src="border-top.png" />
                </td>
            </tr>
            <tr>
                <td style="background-color:white;">
                    <img src="brugadalogo.png" />
                </td>
                <td style="background-color:white; text-align: right;">
                    <img src="msdlogo.png" />
                </td>
            </tr>
        </table>

希望这可以解决您的问题。

于 2013-02-13T19:27:03.530 回答