[英]Image overlay table in html newsletter
我正在制作HTML新聞稿,並不斷遇到此問題。 由於某種原因,頂部的圖像會忽略邊距,並顯示難看的白線。
雖然此網站說電子郵件客戶應接受保證金: http : //www.campaignmonitor.com/css/
有誰知道如何解決這一問題?
編輯:新的和更清潔的代碼,但仍然是同樣的問題! 我不知道該怎么辦。 = /(我的左邊框現在也消失了,我也不知道為什么)
<table cellspacing="0" cellpadding="0" width="811px" style="border:0px solid black;border-collapse:collapse">
<tr>
<td width="150px" VALIGN=TOP style="border-bottom: 1px solid #000000;">Nieuwsbrief #<?php echo $nr; ?></td>
<td width="500px" style="vertical-align: bottom;"><img src="http://pietrow.net/newsletter/images/lad_wide.png" style="z-index:-1;"></img></td>
<td width="150px" align="right" style="vertical-align: top; border-bottom: 1px solid #000000;" >Datum: <?php echo $datum; ?></td>
</tr>
<tr style="background: #DBDBDB; border: 1px solid #000000; border-top: 0px" width="811px">
<td width="270px"><center><a href="http://home.strw.leidenuniv.nl/~kaiser/">Website</a></center></td>
<td width="271px"><center><a href="https://www.facebook.com/LADKaiser">Facebook</a></center></td>
<td width="270px"><center><a href="mailto:kaiser@strw.leidenuniv.nl">Contact</a></center></td>
</tr>
<tr style="background: #DBDBDB; border:0px; border-left: 1px solid #000000; border-right: 1px solid #000000;" width="811px">
<td colspan="3" width="811px"><center><a href="#ENTOP">**ENGLISH VERSION BELOW**</a></center></td>
</tr>
<tr >
<td style="background: #DBDBDB; border: 1px solid #000000; border-bottom: 0px;" colspan="3" width="811px">
記住,對於HTML電子郵件,您需要非常“老派”,因為呈現它們的電子郵件客戶端甚至比舊版本的IE更古老。 因此,請嘗試回想起DIV和可愛的CSS布局之前的日子,以及表格用於布局的日子...
嘗試添加:
cellpadding="0" cellspacing="0"
你的表聲明,然后考慮將您的內容表中的主表內 ,而不是堆積在彼此頂部的兩個表。 或者,如果可以的話,合理化這三列並創建一個表。
您需要display:block;
在您的圖像上。 這是所有圖像在html電子郵件中的外觀示例:
<img style="margin: 0; border: 0; padding: 0; display: block;" src="" width="" height="" alt="">
一些附加說明:
<center>
,而是使用<td align="center">
。 width=""
聲明中使用px
。 示例: width="150"
bgcolor="#DBDBDB"
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.