html製作電子郵件適合跨多個移動設備

您好我正在創建一個enewsletter，並試圖調整它的移動時，我的工作在iphone上看它的大小，但我不確定如何調整大小，因爲大量屏幕變體。繼承人到目前爲止得到了什麼。html製作電子郵件適合跨多個移動設備

所以在我我也添加的東西，如果屏幕寬度是一定的大小覆蓋樣式。

@media only screen and (max-device-width: 320px) { 
      .hide { display: none !important; } 
      #main_content, #inner_content, .mobwidth { width: 300px !important; } 
      #content_rows, .mobwidthtext {width:300px !important;} 
      .banner {height:94px !important;} 
      .top {height:67px !important;} 
      .footer {height:109px !important;} 

    } 


    @media only screen and (max-device-width: 400px) { 
      .hide { display: none !important; } 
      #main_content, #inner_content, .mobwidth { width: 400px !important; } 
      #content_rows, .mobwidthtext {width:380px !important;} 
      .banner {height:117px !important;} 
      .top {height:83px !important;} 
      .footer {height:136px !important;} 

    }

來源

2012-03-28 iamlukeyb

大多數電子郵件客戶端忽略不內聯的CSS聲明。嵌入的樣式表也被忽略。媒體查詢不起作用，因爲它們會覆蓋基於網絡的電子郵件客戶端（例如Gmail）所做的那些查詢（即，您想要執行的操作不起作用）。

電子郵件HTML標準是相當腦死亡。請記住，諸如MS Outlook之類的東西甚至不使用瀏覽器技術來查看電子郵件 - 它們使用MS Word引擎。

這裏有一個很好的指導，以什麼CSS功能，可以在電子郵件中使用：

http://www.campaignmonitor.com/css/

來源

2012-03-28 14:17:30

+1正準備鏈接相同的網站..寶貴的資源 – ManseUK 2012-03-28 14:19:19

我上面的回答不以爲然。使用移動媒體查詢將絕對有效，但android會將您的最大屏幕尺寸設置爲480.請務必保持！對查詢設置的所有樣式保持重要，並確保您的內聯樣式具有一般佈局。這將導致瀏覽器剝離頭部的CSS，並使用內聯。然後，使用您的媒體查詢手機（大多數不剝頭），我會建議在發送前進行大量測試。但是，您唯一的問題就是找到正確的最大寬度，因爲您必須考慮縱向和橫向寬度。同時也考慮到變焦還可以引起一些設備的meia查詢

來源

2012-10-18 11:05:44

html製作電子郵件適合跨多個移動設備

回答

相關問題