在表元素之間創建空間

Question

我試圖在HTML電子郵件的文本和圖像之間創建一個空白。但是，無論我嘗試過什麼，我都無法將圖像向下移動。

小提琴：https://jsfiddle.net/rwcgs0g8/

我要紅色的「下載免費的」形象只是通過5px的下移。

我曾嘗試在圖像前（和ipsum文本之後）添加<td height="10"><!-- PADDING --></td>，但它什麼也沒有做。該圖像來style="display:block;margin-top:5px;"

或者

Answer 1

選擇風格豎起文本和圖像之間的股利。 Div是一個阻塞的html元素。

<div style="height:5px">&nbsp;</div> 

Answer 2

只需將

margin-top: 5px;

添加到圖片的CSS。

Answer 3

<table cellpadding="0" cellspacing="0" border="0" width="600" bgcolor="#0066cb"> 
 
\t <tbody> 
 
\t \t <tr> 
 
\t \t <td height="240" width="15"><!-- PADDING (CREATING AREA) --></td> 
 
\t \t <td> 
 
\t \t <table cellpadding="0" cellspacing="0" border="0"> 
 
\t \t \t <tbody> 
 
\t \t \t \t <tr><td height="10"><!-- PADDING --></td></tr> 
 
\t \t \t \t <tr> 
 
\t \t \t \t  <td> 
 
\t \t \t \t \t \t <!-- IMAGE --> 
 
         <img src="http://i65.tinypic.com/2z3tc0w.png" alt="img1" height="250" style="display:block;" border="0" /> 
 
\t \t \t \t \t </td> 
 
\t \t \t \t \t <td style="font-family:Arial;font-size:27px;line-height:35px;color:#ffffff;"> 
 
        <p style="padding-bottom: 5px;margin: 0;"> 
 
         eguide title lorum ipsum <br/> 
 
\t \t \t \t \t \t dolor sit amet labore etJavaScript 
 
        </p> 
 
\t \t \t \t \t <img src="https://www.imageupload.co.uk/images/2017/08/22/unnamed5.png" alt="img2" style="display:block;" border="0" /> 
 
\t \t \t \t \t </td> 
 
\t \t \t \t </tr> 
 
\t \t \t </tbody> 
 
\t \t </table> \t 
 
\t <!-- END OF SECTION 2 --> \t \t \t \t \t \t \t \t \t \t \t \t 
 
\t </td> \t 
 
\t </tr> 
 
</tbody> 
 
</table>

<p style="padding-bottom: 5px;margin: 0;"> 
    eguide title lorum ipsum <br/> 
    dolor sit amet labore etJavaScript 
</p>