如何在沒有圖像的 Outlook 電子郵件中建立圓角？

在沒有圖像的 Outlook 中設定圓角樣式

使用 CSS 在電子郵件用戶端中建立圓角可以非常簡單。但是，使用 CSS border-radius 屬性的傳統方法在 Microsoft Outlook 中不起作用。在設計具有圓角元素的電子郵件時，此限制提出了挑戰。

不用擔心，有一個解決方案可以讓您在 Outlook 中實現圓角，而無需使用圖像。關鍵在於利用 Outlook 的條件註解和 VML（向量標記語言）。

<!--[if mso]>
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="http://www.EXAMPLE.com/" style="height:40px;v-text-anchor:middle;width:300px;" arcsize="10%" stroke="f" fillcolor="#d62828">
    <w:anchorlock/>
    <center style="color:#ffffff;font-family:sans-serif;font-size:16px;font-weight:bold;">
        Button Text Here!
    </center>
</v:roundrect>
<![endif]-->
<!--[if !mso]> -->
<!--<![endif]-->

此程式碼在 Outlook 2010 中產生圓角的按鈕。它使用 Outlook 的條件註解專門針對 Outlook 並套用 VML 程式碼。 VML 程式碼本身定義了圓角矩形形狀及其屬性，例如顏色和文字。

請注意，此解決方案已在 Outlook 2010 和主要瀏覽器中進行測試，但未在 OWA、Outlook.com 或行動瀏覽器中進行測試。始終建議跨不同平台測試您的程式碼以確保相容性。

以上是如何在沒有圖像的 Outlook 電子郵件中建立圓角？的詳細內容。更多資訊請關注PHP中文網其他相關文章！