1

Fireworks CS4 を使用してスライスした 1 つの画像である HTML 電子メールを作成しようとしています。IE、Opera、Firefox で見ると、実際の画像はきれいに見えます。ただし、Microsoft Outlook 2007 にインポートするとすぐに、上部の画像 (WinstonsAd_r1_c1) の下に水平方向の空白ができ、下部の 2 つの画像 (それぞれ WinstonsAd_r2_c1 と WinstonsAd_r2_c2) の間に垂直方向の空白ができます。

cellpadding="0" cellspacing="0" border="0" と td img {display: block;} があります。と の間のすべてのスペースをコードから削除しようとしました。

今のところ、コードや画像を Web サーバーにアップロードしていません。主な理由は、これを行っている人がまだ購入していないためです。

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <!-- saved from url=(0014)about:internet -->
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <title>WinstonsAd.gif</title>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <!--Fireworks CS3 Dreamweaver CS3 target.  Created Thu Jul 22 17:06:09 GMT-0400 (Eastern Daylight Time) 2010-->
</head>
<body bgcolor="#ffffff">
<style type="text/css">td img {display: block;}</style>
<table border="0" cellpadding="0" cellspacing="0" width="1023">
<!-- fwtable fwsrc="Untitled" fwpage="Page 1" fwbase="WinstonsAd.gif" fwstyle="Dreamweaver" fwdocid = "35095674" fwnested="0" -->
<tr>
<td><img src="spacer.gif" width="646" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="377" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="1" height="1" border="0" alt="" /></td>
</tr>

<tr>
<td colspan="2"><a href="http://www.winstonsbilliards.com"><img name="WinstonsAd_r1_c1" src="WinstonsAd_r1_c1.gif" width="1023" height="647" border="0" id="WinstonsAd_r1_c1" alt="Visit Our Home Page" /></a></td>
<td><img src="spacer.gif" width="1" height="647" border="0" alt="" /></td>
</tr>
<tr>
<td><a href="http://www.google.com/maps?source=s_q&amp;hl=en&amp;q=Winstons+Billiards+Cafe&amp;sll=39.005045,-77.067375&amp;sspn=0.259055,0.458336&amp;ie=UTF8&amp;cd=1&amp;hq=Winstons+Billiards+Cafe&amp;hnear=1776+E+Jefferson+St,+Rockville,+Montgomery,+Maryland+20852&amp;geocode=FQBAVAIdGuhm-w&amp;ll=39.057"><img name="WinstonsAd_r2_c1" src="WinstonsAd_r2_c1.gif" width="646" height="35" border="0" id="WinstonsAd_r2_c1" alt="Google Map To Winston's" /></a></td>
<td><a href="http://www.winstonsbilliards.com"><img name="WinstonsAd_r2_c2" src="WinstonsAd_r2_c2.gif" width="377" height="35" border="0" id="WinstonsAd_r2_c2" alt="Visit Our Home Page" /></a></td>
<td><img src="spacer.gif" width="1" height="35" border="0" alt="" /></td>
</tr>
</table>
</body>
</html>

なぜこれがまだ起こっているのかについての扇動は大歓迎です。

4

3 に答える 3

0

line-height を 0 に設定して「tbody」タグを使用します。

これを試して：

<table style="border: none;" border="0" cellspacing="0" cellpadding="0">
<tbody style="line-height: 0px;">
<tr>
<td><img src="sample_image.jpg" style="padding: 0px; margin:0px; display: block; border: none;"></td>
<td><img src="sample_image.jpg" style="padding: 0px; margin:0px; display: block; border: none;"></td>
</tr>
<tr>
<td><img src="sample_image.jpg" style="padding: 0px; margin:0px; display: block; border: none;"></td>
<td><img src="sample_image.jpg" style="padding: 0px; margin:0px; display: block; border: none;"></td>
</tr>
</tbody>
</table>
于 2013-03-15T10:33:00.220 に答える
0

ここでいくつかのことが起こっているのがわかります:

<tr>
<td><img src="spacer.gif" width="646" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="377" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="1" height="1" border="0" alt="" /></td>
</tr>

<tr>
<td colspan="2"><a href="http://www.winstonsbilliards.com"><img name="WinstonsAd_r1_c1" src="WinstonsAd_r1_c1.gif" width="1023" height="647" border="0" id="WinstonsAd_r1_c1" alt="Visit Our Home Page" /></a></td>
<td><img src="spacer.gif" width="1" height="647" border="0" alt="" /></td>
</tr>
<tr>

酸テストは、列が合計幅に達しないことを報告しています。これがすべての問題ではないかもしれませんが、問題の一部である可能性があります。テーブル全体の幅を調整するか、td から 1 を引きます。

Outlook 07/10 は、画像の display:block 形式をサポートしていません。また、spacer.gif は送信すると壊れる相対リンクです。これは、どの CSS 要素が機能するか (または Outlook で機能しないか) を知るための優れたリソースです。

UI の観点から見ると、あなたのページはかなり広いです...私が知っているほとんどの人は、いくつかの "ペイン" をオンにして Outlook を実行しています。サイズを 800 またはそれ以下に下げることを検討してください。仕事で大量のメールを送信していますが、750 通を超えることはありません。最後に、Outlook と Gmail はデフォルトで画像を無効にしています。画像以外にコンテンツがないため、最初はすべてのユーザーがアクションを実行するまで何も表示されません...良くありません。多くの人はわざわざリンクをクリックしようとしないため、その部分のオーディエンスにとってあなたのメールは効果がありません。テキストは魅力的ではありません...しかし、視聴者がそれを見ることは事実上保証されています. 幸運を。

于 2010-07-23T01:20:21.793 に答える