为什么我的HTML表格中的图片没有正确对齐?

时间:2016-12-07 10:22:27

标签: html html-table

我目前正在制作一个电子邮件签名,一个简单的4张图片以方形2x2 table分隔。

我目前面临的问题是我暂时无法删除td之间的间距。



<style>
d, tr, img  { padding: 0px; margin: 0px; border: none; display: block; }
table { border-collapse: collapse; }    
    
</style>

<table cellpadding="0" cellspacing="0" border="0">
    <tr>
        <td>
            <img src="http://bubblei.co.uk/NDz2UL.png" ></img>
        </td>
        <td>
             <img src="http://bubblei.co.uk/BMSIqd.png"></img>
        </td>
    </tr>
        <td>
            <img src="http://bubblei.co.uk/VcOrDE.png" ></img>
        </td>
        <td>
            <img src="http://bubblei.co.uk/DlwKjq.png"></img>
        </td>
    </tr>
</table>
&#13;
&#13;
&#13;

谁能告诉我哪里出错了,还是指出了我正确的方向?非常感谢!

1 个答案:

答案 0 :(得分:2)

您的图片都有不同的尺寸。我已经冒昧地顺利改变其中一个,结果已经好了。您应该对齐它们并在所有图像上使用相同的尺寸。

<style>
d, tr, img  { padding: 0px; margin: 0px; border: none; display: block; }
table { border-collapse: collapse; }    
    
</style>

<table cellpadding="0" cellspacing="0" border="0">
    <tr>
        <td>
            <img src="http://i.imgur.com/tBrf7Fu.png" >
        </td>
        <td>
             <img src="http://bubblei.co.uk/BMSIqd.png">
        </td>
    </tr>
        <td>
            <img src="http://bubblei.co.uk/VcOrDE.png" >
        </td>
        <td>
            <img src="http://bubblei.co.uk/DlwKjq.png">
        </td>
    </tr>
</table>