如何在转换为常规格式时删除两个img之间的空白区域?

时间:2014-07-08 04:50:58

标签: html css

<table border="0px" cellpadding="0" cellspacing="0" width="700" height="50" style="margin:0px 0px 0px 0px;text-align:center;" >
    <tr>
        <td>
            <p style="background-color:#dedede;line-height:25px;font-family: verdana,sans-serif;font-size:9px;">For more information on delegate registration and sponsorship opportunities</p>
            <img style="margin-top:0;" width="700" height="9" src="http://i61.tinypic.com/28cfx3m.jpg" alt="bottombanner"/>
        </td>
    </tr>
</table>

这是js fiddle

在上面的代码中,<p>和{}之间存在空白区域。 <img>标记,当它转换为格式/电子邮件格式时。如何在不给出负值的情况下删除该空白区域。 提前谢谢。

2 个答案:

答案 0 :(得分:1)

尝试在img风格中添加vertical-align

<img style="margin-top:0; vertical-align:top;" width="700" height="9" src="http://i61.tinypic.com/28cfx3m.jpg" alt="bottombanner"/>

这是jsfiddle - http://jsfiddle.net/GWAkp/3/

已编辑的代码:---请参阅已编辑的p样式

<table cellpadding="0" cellspacing="0" width="700" height="50" style="margin:0px 0px 0px 0px;text-align:center;" >
<tr>
    <td>
        <p style="background-color:#dedede;line-height:25px;font-family: verdana,sans-serif;font-size:9px;margin-bottom:0px; padding-bottom:0px;">For more information on delegate registration and sponsorship opportunities</p>
        <img style="margin-top:0px; vertical-align:top;" width="700" height="9" src="http://i61.tinypic.com/28cfx3m.jpg" alt="bottombanner"/>
    </td>
   </tr>
 </table>

JS小提琴 - http://jsfiddle.net/GWAkp/6/

答案 1 :(得分:0)

display: block;提交给img

margin: 0p

CSS

img {
    display: block
}
p {
    margin: 0
}

这是demo