2

oscommerceプラットフォームを使用して簡単なニュースレターを送信しようとしましたが、内容は画像の少ない単純な表です。プレビューを送信する前に見栄えが良い（いいえcellspacingまたはcellpadding）

プレビュー：

ここに画像の説明を入力してください

しかし、Gmailを使用して受信して開いた後：

ここに画像の説明を入力してください

テーブルが異なることがわかります。私は白い境界線を意味します。

ニュースレターのテーブルとコンテンツを生成するためのコードは次のとおりです。

<table border="0" cellspacing="0" cellpadding="0">
   <tbody>
      <tr>
         <td><img alt="" src="http://www.sfbeautyskin.com/uploads/image/Newsletter/Newsletter.jpg" style="width: 950px; height: 1187px;" /></td>
      </tr>
      <tr>
         <td><a href="http://www.sfbeautyskin.com/images//banners/Promotion_Dec_Xmas.jpg"><img alt="" src="http://www.sfbeautyskin.com/uploads/image/Newsletter2.jpg" style="width: 950px; height: 114px;" /></a></td>
      </tr>
      <tr>
         <td><a href="http://www.sfbeautyskin.com/index.php"><img alt="" src="http://www.sfbeautyskin.com/uploads/image/Newsletter3.jpg" style="width: 950px; height: 158px;" /></a></td>
      </tr>
      <tr>
         <td><a href="http://www.sfbeautyskin.com/contact_us.php"><img alt="" src="http://www.sfbeautyskin.com/uploads/image/Newsletter4.jpg" style="width: 950px; height: 440px;" /></a></td>
      </tr>
   </tbody>
</table>

問題は、境界プロパティを完全に削除する方法です。

4

5 に答える 5

4

私は以前に電子メールで同様の問題を抱えていました。正しく覚えていれば、td内の画像を使用する（または「a」タグを試す）ことで修正しましたdisplay: block。

次のようなものを試してください。

<td><img alt="" style="display: block;" src="http://www.sfbeautyskin.com/uploads/image/Newsletter/Newsletter.jpg" style="width: 950px; height: 1187px;" /></td>
于 2012-12-06T06:53:10.643 に答える
1

style="line-height:0"tdごとに追加

<td style="line-height:0"><img ... /></td>
于 2012-12-06T06:53:45.830 に答える
0

フィドルを確認してください。 http://jsfiddle.net/tuD6L/12/

margin: -5px 0;
于 2012-12-06T07:04:14.100 に答える
0

tr、tdおよびimg要素のそれぞれに、を追加しますstyle="margin:0;padding:0;"

または、テーブルをまとめて削除します。それらは目的を果たさないようです。

于 2012-12-06T06:51:15.867 に答える
0

img次に、タグを定義しますvertical-align:top 

<img src="some.jpg" style="vertical-align:top;" />

デモ

--------

于 2012-12-06T06:52:49.420 に答える