2017-03-03 153 views
-2

我必須使電子郵件模板表背景50%透明和白色的顏色。我已使用以下代碼如何使HTML表背景50%透明

<table role="presentation" border="0" cellpadding="0" align="center" width="100%" style="max-width:200px; min-width:250px; margin: auto; border: 1px solid white;background: rgba(255, 255, 255, 0.5); "> 

當它通過電子郵件客戶端時,背景始終是100%透明的。我甚至試過rgba(255,255,255,0.8);但仍然100%透明。我無法使用不透明度,因爲它在某些瀏覽器中不起作用。

感謝

+0

這取決於您正在測試的客戶端是否支持RGBA。但是,鑑於RGBA值是一個CSS3特性,我認爲它不適用於您測試它的任何客戶端。 – Raymond

+0

HSLA和RGBA顏色值均支持:IE9 +,Firefox 3 +,Chrome,Safari和Opera 10+。 –

回答

0

如果你想與所有的電子郵件客戶端最好的兼容性和瀏覽器你最好的選擇將是創建一個半透明的1x1像素巴紐圖像並將其設置爲您桌子的背景。

table { 
    background: url(http://yourdomain.com/semi-transparent.png) 
} 
+0

與背景顏色不支持'rgba()'的客戶端相比,有更多的電子郵件客戶端阻止圖片(包括背景圖片)。 –

+0

@AndreiGheorghiu公平的觀點,但OP很有可能已經在電子郵件中出現了很多圖片(現在幾乎沒有圖片的電子郵件幾乎不存在),用戶必須點擊*「下載圖片」*。 –

0

不透明度爲跨瀏覽器實現

.table_class { 
    /* IE 8 */ 
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; 

    /* IE 5-7 */ 
    filter: alpha(opacity=50); 

    /* Netscape */ 
    -moz-opacity: 0.5; 

    /* Safari 1.x */ 
    -khtml-opacity: 0.5; 

    /* Good browsers */ 
    opacity: 0.5; 
} 
+0

我相信你錯過了這個問題的關鍵。 OP不希望更改內容的不透明度,而只是改變背景顏色的透明度。但是,他們希望在特定的電子郵件客戶端中忘記提及或有目的地避免提及。這可能是一個祕密。 –

+0

但是,他們希望在特定的電子郵件客戶端中忘記提及或有意避免提及_是否有這種技術? –

+1

'background-color:rgba(255,255,255,.5)'在大多數瀏覽器中都可以使用。 –

0

任何工具使用的是測試你的郵件,我認爲這是錯誤的告訴你rgbahsla沒有被當前的電子郵件客戶端支持。

快速瀏覽一下caniuse rgba就會發現目前使用的瀏覽器只有2.21%不支持它。如果按顯示全部按鈕,您會注意到IE 8及以下版本是不支持它的瀏覽器。

當前沒有使用的電子郵件客戶端使用IE8引擎或更低版本來渲染HTML。 IE8在一年前失去了對微軟的支持。你幾乎在尋找0%不支持rgbahsla的電子郵件客戶端。

另一方面,您似乎已經接受使用background-image替換您的初始background-image: rgba()

根據我發現的一些資源(thisthis),這將影響超過三分之一的電子郵件。
我不認爲有任何準確的方法來測試這個,但你應該記住大多數電子郵件客戶端默認禁用圖像,並且相當多的用戶不會默認從電子郵件設置啓用它們,主要有兩個原因:

  • 他們比精明的少,不要去電子郵件設置
  • 他們過於精明,知道電子郵件病毒可以僞裝成圖像文件,這就是爲什麼圖像顯示默認情況下,擺在首位禁用

儘管Gmail最近默認啓用了圖片顯示功能,但是第在顯示圖像文件之前,先測試圖像文件的有效性(基本檢查惡意軟件)。

事實是很多用戶在默認情況下禁用了圖片。可能超過三分之一。


從外面看,這看起來像是一個公然的情況,即在沒有問題的情況下產生問題。他們爲什麼要這樣做?
如果你開始有你的郵件實際顯示的問題,你就很有可能成爲他們的客戶和購買他們的產品對於一些「嚴重的企業解決方案」,而不僅僅是幾個「光的空閒指針」

無可否認,我將我的假設放在第三方數據上,我和你一樣,無法控制或驗證。但我確實嘗試將多個來源合併,並與我發現的東西保持距離。如果你有機會與我的發現發生衝突,我會很高興看看,我對這個主題感興趣。

+0

正如我前面提到的,如果我使用background-color:rgba(255,255,255,.5),表格在電子郵件中始終顯示爲100%透明。我甚至嘗試過背景顏色:rgba(255,255,255,.8),導致沒有任何變化 – Massey

+0

我目前正在控制/監督爲各種客戶設計約20k每日電子郵件。雖然與大數據相比毫無意義,但仍然比平均水平高出很多。 ['This'](http://emailclientmarketshare.com/)是我測試的電子郵件客戶端列表,效果很好。我相信你正在使用錯誤的工具或錯誤的設置來解析/閱讀你的電子郵件,而當解決方案適用於你的工具/電子郵件客戶端時,你很可能會爲了你的很多用戶而破壞它。 –