簡體   English   中英

Outlook 07 2列靈活布局

[英]Outlook 07 2 column flexible layout

我正在嘗試創建一個電子郵件兩列靈活布局,它適用於 Outlook 07,我在 IE 和 Mozilla Firefox 中的 Outlook 03、hotmail、gmail、yahoo 和 aol 中創建了一個成功的版本,但是在 Outlook 07 中進行測試時去掉我的浮動左CSS。

我想要的是一個布局,左邊有一張照片,右邊有關於照片的文字,什么時候是全屏,但是當屏幕尺寸縮小時,例如在手機上,文字在照片下移動. 當屏幕很大時,我希望它移回兩列外觀。

<div>
   <div style="float:left;width:230px;">
      <a href="http://www.google.co.uk" target="_blank"><img src="http://www.maip.com/media/images/Google%20Logo.jpg" border="0" width="230" height="150" style="margin-bottom:5px;"></a>
   </div>
  <div>
    <h4>Test, Test, Test</h4>
    <p style="margin:0 0 0px 0;">Test</p>
    <p>Test text test text kfjhsdkhfjkdshjkf fjsdlfkjsdljflsdjfl sd dfkljflsdjfkljsdlkfjklsdjf dfksdjfkljsdklfjklsdf sdfjsdljfldjfklsd,f lkl sdjkl jdkl jdkljfdkljfklsdjfklj ldk jlksd  Test text test text Test text test text Test text test text Test text test text Test text test text Test text test text Test text test text  
    <a href="http://www.google.co.uk/" target="_blank" >Read more</a>.</p>
    <p>Arrange to view this property</a></p>
  </div>
</div>

Mozilla 像我想要的那樣呈現 html,但 IE 沒有,目前在 IE 6

任何關於這個問題的幫助真的將不勝感激,因為我已經搜索了一整天,我唯一能找到的是固定寬度的答案,但沒有什么是靈活的。

在 Outlook 2007 中,Microsoft 決定停止使用 IE 引擎來呈現 HTML,而是使用 Word 引擎。

這意味着如果您需要使您的電子郵件適用於 Outlook 2007 用戶,您可以應用的樣式受到嚴格限制。

不幸的是,浮動是 Outlook 2007 不支持的功能之一 - 對於列布局,您必須使用表格。 :(


注意,為了讓 IE 更好地工作,請確保您有一個有效的 DOCTYPE,這樣它就不會恢復到 Quirks 模式。 在所有用戶代理中效果最好的最簡單的 DOCTYPE 是提議的 HTML5 DOCTYPE,它很簡單:

<!DOCTYPE html>

這就是它的全部 - 不需要其他任何東西。 (注意,雖然它在瀏覽器中工作,但 W3 驗證器會抱怨這個 doctype - 如果你想使用驗證器,你可以使用覆蓋 DOCTYPE 功能。)


回到您可以在電子郵件中使用的 CSS... 這里有一個 PDF,顯示了不同客戶端支持哪些 CSS 屬性:
http://www.campaignmonitor.com/reports/Guide_to_CSS_Support_in_Email_2007.pdf

以下是有關支持和不支持內容的更多詳細信息:
http://www.email-standards.org/clients/microsoft-outlook-2007/
http://www.campaignmonitor.com/blog/archives/2007/04/a_guide_to_css_support_in_emai_2.html

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM