web-dev-qa-db-ja.com

Outlookメールで撮影されない画像スタイルの高さと幅

メールとして送信するHTMLコンテンツには、次のdom構造があります。

<a href="http://content.mindmatrix.net/email/814xjqjmpj5r/b59tqx7tzz2x7"
 target="_new">
<span style='text-decoration:none;text-underline:none'>
<img border=0 id="_x0000_i1026"
 src="http://dev.mindmatrix.net/page/e7c9cf53-bae8-4024-a561-355f950cb26b/635246986810000000/original.jpeg?userid=cozmwz91irkm1"
 style='border-bottom-color:black;border-bottom-style:solid;border-bottom-width:
 1px;border-left-color:black;border-left-style:solid;border-left-width:1px;
 border-right-color:black;border-right-style:solid;border-right-width:1px;
 border-top-color:black;border-top-style:solid;border-top-width:1px;
 height:150px;width:120px'>
</span></a>

サイズサムネールにするために、画像にスタイルheight:150px;width:120pxを付けています。この画像の実際の高さと幅は非常に大きいです。問題は、メールがOutlookの受信トレイに入るときにこのスタイルが使用されないことです。だから私の質問は-

1)高さと幅を設定するためにCSSを動作させるにはどうすればよいですか?.

2)Windown live mailで画像がぼやけて表示されます。私は高さと幅のスタイルを修正することに成功したときにOutlookで持続するかどうかはわかりません。どうすればこれを修正できますか

51
Milind Anantwar

単位なしで、幅と高さを別々の属性に入れます。

<img style="margin: 0; border: 0; padding: 0; display: block;"
src="images/img.jpg" width="120" height="150">

別のオプション:

<!--[if gte mso 9]>
<style type="text/css">
img.header { width: 600px; } /* or something like that */
</style>
<![endif]-->
96
Anup

これは私のために働いた:

src="{0}"  width=30 height=30 style="border:0;"

これまでのところ、何も機能していません。

14
Ela

なんらかの奇妙な理由で、pxを省略する必要があります。

10
Paul
<img id="_x0000_i1026" src="images/img.jpg" width="120" height="150" />

これはGmailとOutlookの両方で機能しました。

4
mable george

幅と高さからpxを除外するとOutlookのトリックが行われたことを確認できます。

<img src="image.png" style="height: 55px;width:139px;border:0;" height="55" width="139">
4
Joakim Ling

シェアポイントデータに基づいてOutlook 2010の電子メールを作成することができました。しかし、Outlook電子メールを作成するとき、Outlookは賢明なことに、IMGAの幅と高さをcmに減らします。おもしろいことに、幅と高さを使用すると、メールを転送するときに正しく機能しますが、メールを開くときは機能しません。

ハック修正。

私は19.05cm x 3.98cmのはずの画像720px X150pxを持っていました。ただし、Outlookは画像の幅と高さを(15.24cm X 3.18cm)に設定します。 *明らかにこれは問題です。

私が使用したハックは、次のようにHTMLイメージタグを設定していました

<img src="...." style="width:720px;heigh:150px" width="900" height="187.5" />

なぜその幅と高さ; Outlookが言っていることと、あるべきこと(720 X 25%= 900)の比率(25%増加)です。それはきれいではありませんが、動作します。

2
Jay

これはOutlookで私のために働く:

<img src="image.jpg" width="120" style="display:block;width:100%" />

私はそれがあなたのために働くことを望みます。

0
gjseminario

Outlookで正しく表示されない画像にも同じ問題があります。画像の高さと幅を適用するためにpxと%を使用しています。しかし、pxと%を削除し、htmlの値だけを使用すると、うまくいきます。たとえば、width = "800px"を使用していましたが、widht = "800"を使用し、問題は解決しました。