如何在通過HTML電子郵件發送的圖像上創建最大寬度和最大高度效果？

我的應用程序發送包含一個或多個未知尺寸和寬/高比例圖像的HTML電子郵件。我想要的效果是如何在通過HTML電子郵件發送的圖像上創建最大寬度和最大高度效果？

<img style="max-width: 200px; max-height: 200px;" src="..." />

但是，它似乎像大多數電子郵件客戶端，包括Gmail和Outlook 2010，忽略此CSS。簡單地設置寬度和高度不起作用，因爲圖像不是方形的，我不知道提前的大小和比例。

來源

2011-03-30 David Smith

如果圖像大小未知，程序化路線將起作用：在處理/構建電子郵件時，您必須查看圖像的尺寸並相應地在html中設置高度和寬度。

通過這種方式，您將確保所有（或大多數:)客戶端都能正確縮放圖像。

來源

2011-03-30 12:38:10 Groovetrain

不幸的是，在電子郵件客戶端中廣泛支持的CSS屬性並不多。

這是chart about the current situation。

我只能想到像@Groovetrain建議的選項，或者從圖像中編程生成縮略圖，存儲它們，並使用電子郵件中的縮略圖。

來源

2011-03-30 12:50:21 kapa

如果你不能做一個編程解決方案一樣Groovetrain建議，最好的途徑是

知道最大&最小尺寸是可能會出現的圖像。
確保包含元素允許最大尺寸。
在包含元素中，設置水平對齊（如有必要填充）&，以便電子郵件看起來可接受同時具有最大和最小可能的圖像。

我使用有限的API支持的電子郵件系統，所以有時候我不得不放下腳步，堅持要上傳圖片。

來源

2011-06-17 21:35:02

我知道這是舊的，但我不得不實施這一點。基於什麼Groovetrain建議 - 編程看圖像時，你建立你的電子郵件的html代碼 - 這裏有限制的圖像600的寬度一些C＃ASP.NET代碼，如果過大：

string imgPth = HttpContext.Current.Server.MapPath("/images/yourimage.jpg"); 
System.Drawing.Image img = System.Drawing.Image.FromFile(imgPth); 
string emailImage = "<img src='http://www.yourdomain.com/images/yourimage.jpg'"; 
if (img.Width > 600) 
    emailImage += " width='600' style='width:600px;'"; 
emailImage += "/>";

那麼很明顯將emailImage添加到您的電子郵件正文。

來源

2013-10-10 23:12:39 germankiwi

注意width ='600'正確地忽略了'px'。如果包含'px'，Outlook將完全忽略該設置。 – Jerome 2013-11-07 20:50:12

您可以使用此方法來控制寬度：

<table width="100%"> <!-- a width 100% container --> 
    <tr> 
     <td></td> <!-- an empty cell, which will adapt its width --> 
     <td width="200"> <!-- it's like max-width:200px --> 
      <img src="your_image" width="100%" /> 
     </td> 
     <td></td> <!-- another empty cell, which will adapt its width --> 
    </tr> 
</table>

這個技巧應該工作。如果您的屏幕寬度小於200像素，圖像也應該顯得更小！默認情況下，圖像將居中！如果你想要它左對齊或右對齊，請嘗試刪除第一個空單元格，或最後一個（取決於你想要做什麼！）

對於最大高度，我不知道...在這種情況下，身高將自動計算！

希望能幫助你配合！

編輯：我同意最好的答案！如果腳本構造您的電子郵件，請讓您的腳本獲取寬度和高度，並調整您的代碼。它應該工作...

來源

2016-06-16 10:29:08 Ben

如何在通過HTML電子郵件發送的圖像上創建最大寬度和最大高度效果？

回答

相關問題