在智能手機上閱讀的HTML鏈接

我有智能手機的問題。在智能手機上閱讀電子郵件時，帶有鏈接的圖片會向右移動。圖像左側有一個空白區域。只限於那些包含網址的人。在智能手機上閱讀的HTML鏈接

有誰知道如何解決這個問題？我怎麼解決它？我已將所有填充和邊距設置爲0，將邊框設置爲0 ....我還可以嘗試什麼？

{ 
    display:block; 
    margin-right:0px; 
    margin-top:0px; 
    margin-bottom:0px; 
    padding-left:0px; 
    padding-right:0px; 
    padding-top:0px; 
    padding-bottom:0px; 
    outline:0; 
    border;0; 
}

謝謝。

來源

2013-11-21 user3018401

你可以做'保證金：0px'和'填充：0px'。沒有必要做左，右，底等，因爲它涵蓋了所有。 – SaturnsEye

這些圖像是否包含在「a」元素中？你是否檢查過「text-indent」，「padding」，「borders」（透明或其他），「font-size」（等等）？ –

這可能不會導致它，但我不喜歡看到它，你的邊界屬性格式不正確的';'代替 '：'。 – Gobo

首先，有一個與你的CSS邊框聲明的問題，它應該是：

border: 0;

你也不需要單獨聲明每個填充/保證金的邊緣，你可以很容易地使用：

margin: 0; 
padding: 0;

我希望你看到這是由於在父錨，而不是圖像本身的樣式。你可以嘗試以下的（雖然這是一個有點毯復位;你可能不會需要這一切）：

a{ 
    display: block; 
    padding: 0; 
    margin: 0; 
    outline: 0 none; 
    border: 0 none; 
    text-indent: 0; 
    font-size: 0; 
}

如果你喜歡，把你的代碼片段，您可以複製這個問題，我們可以採取更深入的瞭解？

來源

2013-11-21 16:39:41 johnkavanagh

您應該在圖像標記上內嵌CSS。你也可以裁剪你的CSS一點點。

這裏是所有你需要在HTML電子郵件鏈接的圖像：

<a href=""><img alt="" src="" width="" height="" style="margin: 0; border: 0; padding: 0; display: block;"></a>

如果你的差距仍然存在，這是因爲父元素，或其他一些CSS你對一個或圖片代碼。在html-email中將每個圖像保存在它自己的<td>中是一種很好的做法。將上面的標籤放在它自己的表格單元中將會很好地工作。

此外，添加到您的header style tag for Outlook：

#outlook a {padding:0;}

來源

2013-11-22 13:57:40 John

在智能手機上閱讀的HTML鏈接

回答

相關問題