0

これは常に聞かれる種類の質問であることは知っていますが、見つけることができるすべての答えを調べてきましたが、これを解決するものは何もありません. 問題は、Outlook 2010 がテーブル セル内のすべての画像の下 (または上) に 1 ピクセルのギャップを追加することです。(下か上かは、valign="top" または valign="bottom" のどちらを使用するかによって異なります)。設定表示：ブロック；役に立たないようです。

この例を Windows 7 の Outlook 2010 で見ると、Google ロゴの下に赤い線が表示されます。私がしたことは何もこの行を削除しません。

<table width="275" height="95" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse;" bgcolor="red">
    <tr>
        <td width="275" height="95" align="left" valign="bottom" style="font-size:0; line-height: 0; border-collapse: collapse;">
            <img src="https://www.google.co.uk/images/srpr/logo3w.png" border="0" style="display: block; vertical-align: top;"></td>
    </tr>
</table>

行を削除することはできないという結論に達しています。私が間違っていることを証明したい人はいますか？

4

6 に答える 6

1

これを試して元に戻してください

<img src="https://www.google.co.uk/images/srpr/logo3w.png" border="0" style="display: block;" align="top">
于 2012-08-23T12:42:54.707 に答える
1

私も同じ問題を抱えていましたが、 div 、 p タグ内に画像を挿入し、メールクライアントによって生成された外部 css をオーバーライドすることで問題を解決しました。

<td colspan="3">
        <div class="override" style="height: 201px !important;">
        <p style="height: 201px !important; ">
            <img src="images/path" width="800" height="201" alt="">
        </p>
        </div>
</td>

<style type="text/css">
p {margin-bottom: 0;}
.ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td {
line-height: 0%;
}
p, .override{
font-size:0pt ;
line-height:0px;
}
</style>

これが誰にでも役立つことを願っています。

于 2014-10-14T14:19:28.613 に答える
1

これを試してみてください - 見てください！

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<table width="275" height="95" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse;" bgcolor="red;">
<tr>
<td width="275" height="95" align="left" valign="bottom" style="font-size:0; line-height: 0; border-collapse: collapse;"><img src="https://www.google.co.uk/images/srpr/logo3w.png" border="0" style="display: block; vertical-align: top;"></td>
</tr>
</table>

</body>
</html>
于 2014-07-15T22:16:48.623 に答える
0

ちょっと私はこれが古いスレッドであることを知っていますが、私はちょうどこの問題を抱えていて、実際に奇妙な方法でそれを回避することができました. 私の場合、画像の下に 1 ピクセルのギャップが現れました。テーブル構造から画像を削除し、html の高さを画像の実際の高さより 1 ピクセル低く設定しました。以下は、私がメールで使用した正確なコード (画像ソースは編集済み) です。

</table>

    <img src='http://img1.jpg' height='400' width='552' alt='' border='0' style='display:block;align:bottom;border:none;margin:0;padding:0;height:401px;' />

<table border='0' style='padding:0;margin:0;border-collapse:collapse;' cellpadding="0" cellspacing="0">

何とかこれで直りました。テーブル構造から実際に画像を削除する必要があるかどうかはわかりません。

于 2012-11-01T15:01:33.593 に答える
0

私のために働いた1つのトリック： align="absbottom texttop " を img に追加し、 line-height:10px (またはそれ以下) を画像をラップする td に追加します

于 2016-06-17T10:42:06.353 に答える