如何在不影響背景圖像的情況下將填充添加到？

-1

我正在尋找解決方案，我可以在'h1'標籤中添加填充。下面的標記允許我在Outlook中渲染背景圖像。但是，當我向td添加填充時，填充會添加到背景 - 這不是我想要的結果。有誰知道我可以如何添加填充到與Outlook電子郵件客戶端兼容的h1？如何在不影響背景圖像的情況下將填充添加到？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title></title> 
</head> 

<body> 
    <table class="emailwrap" style="background-color:#fff;" cellpadding="0" cellspacing="0" width="100%" align="center"> 
     <tr> 
      <td style="padding-left:35px;" class="mbl-pad-1" background="images/banner1.jpg" bgcolor="#7bceeb" width="600" height="248" valign="middle" > 
       <!--[if gte mso 9]> 
       <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:600px;height:248px;"> 
       <v:fill type="tile" src="images/banner1.jpg" color="#7bceeb" /> 
       <v:textbox inset="0,0,0,0"> 
       <![endif]--> 

       <h1 class="emailh1" style="font-size:65px; line-height:60px; font-family:Arial, sans-serif; color:#fff; text-align:left; margin:0;">DO YOU TRUST<br/>YOUR SOURCE?</h1> 

       <!--[if gte mso 9]> 
       </v:textbox> 
       </v:rect> 
       <![endif]--> 

      </td> 
     </tr> 
    </table> 
</body> 
</html>

來源

2015-09-07 rman215

您的標記有多個語法問題。首先驗證您的HTML。 – Xufox

現在應該會更好。檢查它agian – rman215

我沒有看到任何'h2'標記在您的html –

一堆finagling和用戶的幫助後Gortonington我能找到使用這裏找到Bullet Proof Background我能得到的背景圖像標記一個solution.By在Outlook中正確顯示。爲了給h1標籤添加填充，我使用了Gortonigton的建議，並添加了一個寬度爲100％的額外表格，然後添加了一個填充樣式以正確對齊文本。感謝大家的幫助！

<table width="100%" border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
     <td background="images/banner1.jpg" bgcolor="#333" width="100%" valign="top"> 
      <!--[if gte mso 9]> 
      <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:600px;height:248px;"> 
      <v:fill type="tile" src="images/banner1.jpg" color="#333" /> 
      <v:textbox inset="0,0,0,0"> 
      <![endif]--> 
      <table width="100%" border="0" cellspacing="0" cellpadding="0"> 
       <tr> 
        <td class="mbl-pad-1" style="padding-left:35px; padding-top:60px; padding-bottom:60px;"> 
        <h1 class="emailh1" style="font-size:65px; line-height:60px; font-family:Arial, sans-serif; color:#fff; text-align:left; margin-top:0; margin-bottom:0;">DO YOU TRUST<br/>YOUR SOURCE?</h1> 
        </td> 
      </tr> 
      </table> 
      <!--[if gte mso 9]> 
      </v:textbox> 
      </v:rect> 
      <![endif]--> 
      </td> 
    </tr> 
</table>

來源

2015-09-08 01:21:58 rman215

我想補充的<h1>圍繞<div>標籤內<td>和填充添加到它。

<td> 
    <div style="padding: 10px;"> 
     <h1>...</h1> 
    </div> 
</td>

//編輯：

如果這只是針對電子郵件，我只想用表空間它像這樣：

<td> 
    <table> 
     <tr><td colspan="3" height="10"></td></tr> 
     <tr> 
      <td width="10"></td> 
      <td><h1>...</h1></td> 
      <td width="10"></td> 
     </tr> 
     <tr><td colspan="3" height="10"></td></tr> 
    </table> 
</td>

來源

2015-09-07 08:24:17

我試過這個以及outlook不提供填充div標籤。 – rman215

添加保證金左：35px;爲H1標籤

<td> 
<h1 style="margin-left:35px;"></h1> 
</td>

來源

2015-09-07 08:32:11

我試過這個。 Outlook不支持h1標籤中的邊距 – rman215

巢內以100％的寬度的新表並添加填充到該TD。

所以基本上：

<td with background > 
     <table width="100%"> 
     <tr> 
     <td style="padding: Xpx;">your content</td> 
     </tr> 
     </table> 
    </td>

來源

2015-09-07 12:54:01 Gortonington

如何在不影響背景圖像的情況下將填充添加到​​？

回答

相關問題

如何在不影響背景圖像的情況下將填充添加到？