使用下面的代碼,我為我的電子郵件簽名設定樣式,它在不同的瀏覽器中看起來不錯。但在 MS Outlook 中,大小和行高有問題。
<table aria-hidden="true" cellspacing="0" cellpadding="0" width="652" style="margin: 0; max-width: 100%;">
<tr>
<td style="font-family:'Calibri', sans-serif;font-size:10pt;overflow:hidden;padding-left:2px;word-break:normal;text-align:left;vertical-align:top" colspan="7">
Some text<br>
</td>
</tr>
<tr>
<td rowspan="3">
<img src="https://via.placeholder.com/133x105.png?text=Image" width="133" alt="" style="display: block; margin: 0; padding-top:2px;max-width: 100%;" />
</td>
<td width="111" valign="top" style="padding-left:15px;">
<p style="font-family:'Calibri', sans-serif;font-size:10pt; margin: 0;">
<strong>John Doe</strong><br />Text
</p>
</td>
<td valign="top">
<img src="https://via.placeholder.com/251x63.png?text=Image" width="251" alt="" style="display: block; margin: 0; max-width: 100%;" />
</td>
<td valign="top" colspan="4">
<img src="https://via.placeholder.com/142x63.png?text=Image" width="142" alt="" style="display: block; margin: 0; max-width: 100%;" />
</td>
</tr>
<tr>
<td valign="top" style="padding-left:15px;" colspan="2">
<p style="font-family:'Calibri', sans-serif;font-size:9pt;line-height:12pt;">
1234 5698 56
</p>
</td>
<td valign="top" colspan="4">
</td>
</tr>
<tr>
<td valign="top" style="padding-left:15px;" colspan="2">
<p style="font-family:'Calibri', sans-serif;font-size:9pt;line-height:10pt;">
[email protected]<br>Comapny Name | Street | ZIP City
</p>
</td>
<td valign="bottom">
<a href="#"><img src="https://via.placeholder.com/55x29.png?text=Image" width="55" alt="youtube" style="display: block; margin: 0; max-width: 100%;" /></a>
</td>
<td valign="bottom">
<a href="#"><img src="https://via.placeholder.com/30x29.png?text=Image" width="30" alt="Marbo Mediengruppe" style="display: block; margin: 0; max-width: 100%;" /></a>
</td>
<td valign="bottom">
<a href="#"><img src="https://via.placeholder.com/30x29.png?text=Image" width="30" alt="Instagram" style="display: block; margin: 0; max-width: 100%;" /></a>
</td>
<td valign="bottom">
<a href="#"><img src="https://via.placeholder.com/27x29.png?text=Image" width="27" alt="facebook" style="display: block; margin: 0; max-width: 100%;" /></a>
</td>
</tr>
</table>
在瀏覽器中,它看起來應該如此。

在展望中它看起來像

我試圖設定行高但沒有任何結果。
uj5u.com熱心網友回復:
Outlook 使用 Word 呈現郵件正文。您可以在 Outlook 中的 Word HTML 和 CSS 呈現功能一文中找到支持和不支持的 HTML 元素、屬性和級聯樣式表屬性。
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/421184.html
標籤:
