@media查詢在通過iOS查看html電子郵件時被忽略郵件

我正在處理非常奇怪的問題。我已經在iphone6s和iphone6@media查詢在通過iOS查看html電子郵件時被忽略郵件

1）的電子郵件被髮送到在iPhone

2）的HTML消息從iOS郵件

3觀察配置了非Gmail帳戶）這裏測試是它變得奇怪，我會盡量描述最好的 a）如果我通過點擊電子郵件列表中的電子郵件直接從客戶端查看電子郵件。媒體查詢不受尊重。 b）如果我查看消息，請單擊向下箭頭查看以前的消息，然後單擊向上查看原始消息，尊重媒體查詢。

4）我試圖我有它下降到這個簡單的例子既icloud的和Yahoo帳戶和兩個不同的iPhone（6和6S）

。當然所有的簡單模擬器的工作，你所期望的，而不是表現出的問題

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title>this is a test</title> 
    <meta charset="UTF-8"> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <style> 
      /* ----------- iPhone 5 and 5S ----------- */ 
      /* Portrait */ 
      @media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) { 
       #main-wrapper{ 
        max-width: 320px; 
        margin: 2px auto; 
        background-color: red; 
       } 

      } 
     </style> 
</head> 
<body> 
<div id="main-wrapper" style=" background-color: #ffffff;"> 
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis in ante velit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas imperdiet erat metus, sed maximus tortor dignissim vel. Fusce luctus eget turpis a pretium. Nunc sagittis vulputate risus et porta. Cras eros nisl, placerat id ultricies sit amet, eleifend vel augue. Nullam dignissim sodales rhoncus. Morbi hendrerit aliquam tortor. 

    Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nulla tellus massa, accumsan ac ex a, congue lobortis ipsum. Sed vitae ultrices purus. Nam vulputate lacus vitae massa laoreet scelerisque. Duis in risus non elit sodales pharetra. Nunc ultrices nisl quis leo mollis, sed consectetur tortor placerat. Fusce ultricies eleifend nisi, in congue metus iaculis ut. 
</div> 
</body> 
</html>

來源

2016-03-15 randy

假設由你的意思是默認的IOS電子郵件閱讀器iOS郵件，媒體查詢應該得到支持。有兩件事情

你不應該需要在你的視口代碼的initial-scale屬性，你嘗試過<meta name="viewport" content="width=device-width">？
根據您希望CSS影響的特定環境的具體情況，您可能不需要這樣一個加載的標記。你有沒有試過類似@media screen and (max-device-width: 568px)？

來源

2016-03-15 17:22:04

感謝您的想法它最終成爲和（方向：肖像），導致古怪 – randy

@media查詢在通過iOS查看html電子郵件時被忽略郵件

回答

相關問題