iOS中的圖像縮小郵件

我正在爲應用程序創建HTML郵件模板，並且該模板包含440px寬的圖像。iOS中的圖像縮小郵件

當我在我的iphone上看它時，它超出了屏幕的寬度。我曾多次看到iOS Mail收縮電子郵件的大小以適應所有內容（例如，來自Apple的電子郵件）。

關於我可能做錯什麼的想法？圖像CSS和它的容器CSS是：

.photo { 
    width: 400px; 
    height: 460px; 
    padding: 20px; 
    background: #fff; 
    -moz-box-shadow: 0 0 10px rgba(0, 0, 0, .5); 
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); 
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); 
    position: relative; 
    overflow: hidden; 
} 
.photo img.main-photo { 
    max-width: 400px; 
} 
.photo div.caption { 
    width: 400px; 
    position: absolute; 
    bottom: 20px; 
    font-family: 'Indie Flower'; 
    height: 50px; 
    font-size: 20px; 
}

與實際HTML是

<div class="photo"> 
    <img src="{{ photo.images.standard_resolution.url }}" class="main-photo" /> 
    <div class="caption"> 
     {{ photo.caption.text }} 
    </div> 
</div>

UPDATE：這裏是它的外觀的例子。我不希望它伸展超出屏幕

enter image description here

來源

2011-04-22 Brenden

在編輯郵件或在iOS郵件應用程序中查看收到的郵件時，您是否看到此問題？ – Robin 2011-04-22 23:28:27

在iOS郵件應用程序中查看收到的郵件 – Brenden 2011-04-23 00:49:00

剛剛更新了上面的初始文章以及它的外觀 – Brenden 2011-04-23 00:51:56

嘗試刪除寬度和只使用最大寬度。我認爲這會解決你的問題。

來源

2011-04-26 12:06:36 Luuk

400px太寬，非視網膜iPhone的寬度爲320px。如果Mail類似Mobile Safari，它甚至會把iPhone 4當作320px。你嘗試過更小的尺寸嗎？

來源

2011-04-29 00:32:38

iOS中的圖像縮小郵件

回答

相關問題