このpng-24画像は、その色が302×354の寸法の端まで完全に広がっているように見えます。
ただし、tdに入れてメールで送信すると、次のようになります。
htmlテーブル：
<td rowspan="3" style="vertical-align:top; border:1px solid #e6e6e6; background-color:#f0f1f2;">
<img src="email_img.png" height="177px" alt="Sample image" />
</td>
スクリーンショットはGmailからのものです。ただし、他の電子メールクライアントは調べていません。なぜこれが起こっているのか考えていますか？ありがとう！
これは、各電子メールクライアントが独自のレンダリングエンジン、つまりOutlookと他のデスクトップ電子メールクライアントを持っているためです。これを回避するには、多くのクロスクライアントテストを実行し、すべてが「好き」なインラインスタイルのみを使用する必要があります。
また
これがGmailで表示されている場合は、GmailのスタイルシートがカスケードされてDOM要素に影響を与えている可能性があります。これを回避するには、テーブルのスタイルを定義する必要があります（電子メールであるためインラインであるか、サーバー上のスタイルシートを参照していますが、Webベースのクライアントは本体の外側のすべてを削除する可能性があります）
<td rowspan="3" style="vertical-align:top; border:1px solid #e6e6e6; background-color:#f0f1f2;" cellpadding="0">
<img src="email_img.png" height="177px" alt="Sample image" />
</td>
セルパディングを調整してみてください。その画像にも高さを設定したいと思います。私の意見では、メールはお尻に大きな苦痛を与えますが、すべてを指定し、個々のHTMLレンダリングエンジンに何も任せないと、頭痛の種ははるかに少なくなります。
電子メールの場合は常に使用します<img src="[img url]"height="[img height]" width="[img width]" style="display:inline-block;" border="0">それがないと、一部の電子メールクライアントは境界線を追加します
をスタイリングする必要がありimgます。
CSSをdisplay:blockまたはに設定しvertical-align:topます。