4

私は HTML メールを作成しています。背景画像は何にも使用できないため<body>、セル内の境界線画像を 100% の高さにすることでこれを回避できると考えました。おそらくそれは希望的観測でしたか?過去に機能していたソリューションが最新のブラウザーでは機能しなくなったものを検索しました。セルにハードな高さを設定せずにこれを実現するための特別なトリックはありますか?

これまでに試したことは次のとおりです。

<td width="25" style="margin:0; padding:0;">
    <img src="http://www.example.com/images/side-left.jpg" width="25" height="100%" alt="border" style="margin:0; padding:0; display: block;" />
</td>

画像をテーブル全体の 100% の高さに引き伸ばします (テーブルが<td>.

<td width="25" height="100%" style="margin:0; padding:0;">
    <div style="height:100%; diplay: block;">
        <img src="http://www.example.com/images/side-left.jpg" width="25" height="100%" alt="border" style="margin:0; padding:0; display: block;" />
    </div>
</td>

同上

<td width="25" height="1" style="margin:0; padding:0;">
    <div style="height:100%; diplay: block;">
        <img src="http://www.example.com/images/side-left.jpg" width="25" height="100%" alt="border" style="margin:0; padding:0; display: block;" />
    </div>
</td>

小さいtdサイズを設定しても、期待どおりに引き伸ばされることはありません。

4

3 に答える 3

0

ほとんどの場合、Outlook で問題が発生していると思いますか?

  • Hotmail は背景画像を認識しませんが、height="100%."​​ は認識しているようです。

  • 私自身のテストでは、画像で height="100%" を宣言すると、主要な Web ベースのクライアント (Hotmail、Gmail、Yahoo) のセルの高さまで正常に引き伸ばされます。

  • Outlook では、画像を固定サイズに拡大することしかできません (また、画像は両方向に比例してのみ拡大できます)。他のクライアントでは、一方向に大幅に伸ばすことができます (元のサイズの最大 4000% まで?)。

チップ:

1) Outlook に合わせたサイズの縦長の画像、またはそれより少し縦長の画像を使用します。

2) 高さ = "100%" を使用すると、Outlook 以外のほとんどのクライアントで必要に応じて画像が引き伸ばされます。

3) テーブル セルの縦方向に繰り返される背景画像を宣言することも、フォールバックとして役立ちます (ただし、Outlook や Hotmail では役に立ちません)。

ボーダー画像の私の推奨ソリューションは次のとおりです。

<td width="25" height="100%" valign="top" style="background:Transparent url('http://www.mysite.com/images/side-left.jpg') repeat-y;margin:0; padding:0;">
    <img style="margin:0; padding:0;display:block;" src="http://www.mysite.com/images/side-left.jpg" alt="border" width="25" height="100%" />
</td>
于 2012-08-19T19:47:18.730 に答える
-1

css でセルの高さをピクセルではなくパーセンテージにしてみてください。Jezen Thomas が言ったように、css を使用しますが、今回はこのようにします。

td {border: 4px solid red; height: /*height in desired percentage*/%; valign:top;}
img {height: 100%; width: 100%;}​ 

さらに、ウェブページや電子メールを表だけにフォーマットすることは悪い習慣です。css で完全に実行し、表形式のデータにのみテーブルを使用するようにしてください。でもそれはあなたがやりたいことだから、私はあなたを止めるつもりはありません。

残りの html を取得してもよろしいでしょうか。興味があれば適切な css の方法を示すことができますか?

于 2012-06-21T21:11:36.753 に答える
-5

メールで div を使用しないでください。gmail と android はこれをサポートしていません。

電子メールで画像の高さまたは幅を 100% にすることはできません。正確なサイズを px で入力する必要があります。それはかなり迷惑です

于 2012-07-02T11:25:27.403 に答える