不適用於Gmail的樣式

我正在向各種電子郵件客戶端（例如yahoo，hotmail，Gmail等）發送電子郵件。不適用於Gmail的樣式

我有一個ID爲OrderInfo裏面的div，我有一個變量它會生成一個動態表。

HTML

<div id="OrderInfo"> 
    variable 
</div>

動態表產生與小寫頭（th），所以我想改變這種狀況，以大寫字母和幾個造型。所以我寫了一個選擇

CSS

#OrderInfo table tr th { 
    text-transform: uppercase; 
    background-color: #737373; 
    color: white; 
}

這是工作的罰款雅虎，Hotmail而不是Gmail的。

我發現只有內聯樣式適用於Gmail，但我如何修改動態樣式。

我無法控制變量（我在div中提到過），它會生成一個表格，其中的值會在發送到客戶端時進行處理。

所以我不能讓一個靜態表，不能改變它呈現

來源

2016-02-18 Dheeraj Patnaik

添加內聯CSS。 –

我們可以編寫內嵌選擇器嗎？ –

許多電子郵件服務提供者不包含在電子郵件模板CSS支持的方式。而是使用內聯的CSS。

此外，電子郵件模板應該使用表格形成，因爲它只支持HTML3。您可以使用HTML4/5元素td標籤

請檢查this link。它將幫助您構建電子郵件模板。

來源

2016-02-18 12:13:23

的Gmail以及一些其他的Web和桌面/移動客戶端除掉CSS樣式表無論是進口的還是嵌在head

一個<style>...</style>節點把它們聯：

<div id="OrderInfo"> 
    <table> 
     <tr> 
      <td style="text-transform: uppercase; background-color: #737373; color: white;"> 
       <!-- .......... --> 
      </td> 
     </tr> 
    </table> 
</div>

作爲更一般的建議：建立電子郵件html不是微不足道的，因爲最終結果可能會因配方的郵件客戶端而異。

一般的規則是儘量簡化，避免「現代」的CSS特徵;儘可能使用嵌套表格而不是divs（有些人說如果你正在構建一個15年前的網頁，就建立html）。

以上內容非常籠統，可能並非總是如此。

網上有幾個資源提供瞭如何製作html電子郵件或模板的建議和規則。

最後，如果你想，以確保結果的唯一的，一個規則始終遵循：與各種客戶端測試你的消息

來源

2016-02-18 12:14:34 Paolo

我想給它不是TH動態（在運行時生成的）的的表到div –

（更新答案）：確定把CSS在線''元素 - 或需要得到樣式任何元素。 – Paolo

我想給它一個動態的（在運行時產生的）表格而不是div。我不能把那個static.It將一些邏輯來產生，這是我@Paolo –

，你需要使用內聯樣式Gmail不支持嵌入式CSS，看看這個

12 Things you MUST Know when Developing Emails for Gmail and Gmail Mobile Apps

這裏是你能做什麼：

<th bgcolor="#737373" style="text-transform: uppercase; color:white"></th>

來源

2016-02-18 12:14:46 dippas

它是一個動態生成的th。我可以如何預先設計風格？我如何給內聯選擇器？ @dippas –

我剛剛給你一個關於如何在內聯風格上回答的例子。 – dippas

試着用這個造型讓你的鏈接紅色與懸停狀況無特殊效果：

a:link{color: red} 
a:visited{color: red} 
a:hover{color: red} 
a:active{color: red}

這對我來說工作正常，但如果4個語句中的任何一個缺少它不會工作，無論是在一個Gmail客戶端，也不在Outlook中。它們也必須以上面所示的順序出現。

來源

2017-05-08 06:26:09

不適用於Gmail的樣式

回答

相關問題