2015-04-01 109 views
0

我試圖從HTML郵件中的表格中刪除三個單元格邊框。我現在的情況是這樣的:在Outlook 2013中刪除HTML郵件中的單元格邊框

我有什麼 What I have

我想要什麼 What I want

代碼:

<html> 

    <head> 

     <style type="text/css"> 

      body 
      { 
       font-family:Calibri, Arial, Sans-Serif; 
       font-weight:normal; 
      } 

      table 
      { 
       font-family:Calibri, Arial, Sans-Serif; 
       font-weight:normal; 
       font-size:14px; 
       border-color:#CCCCCC; 
       border-collapse:collapse; 
       width:700px; 
      } 

      table th 
      {   
       font-weight:bold;    
       padding:10px 5px; 
       border-style:solid; 
       border-width:1px; 
       word-break:normal; 
       border-color:#CCCCCC; 
       background-color:#F0F0F0; 
      } 

      table td 
      { 
       padding:10px 5px; 
       border-style:solid; 
       border-width:1px; 
       word-break:normal; 
       border-color:#CCCCCC; 
       background-color:#FFFFFF; 
      } 

      .td-left-column 
      { 
       font-style:italic; 
       background-color:#F0F0F0; 
       text-align:right; 
       white-space:nowrap; 
       width:100px; 
      } 

      p.italic 
      { 
       font-style:italic 
      } 

     </style> 

    </head> 

    <body> 

     The script 

     <br><br> 

     <em>' + $ScriptName + '</em> 

     has sent a notification. See below for details... 

     <br><br> 

     <table> 

      <tr> 
       <th colspan="2">Script</th> 
      </tr> 

      <tr> 
       <td class="td-left-column">Path</td> 
       <td>' + $ScriptPath + '</td> 
      </tr> 

      <tr> 
       <td class="td-left-column">Server</td> 
       <td>' + $Server + '</td> 
      </tr> 

      <tr> 
       <td class="td-left-column">Name</td> 
       <td>' + $ScriptName + '</td> 
      </tr> 

      <tr> 
       <td class="td-left-column">Log-File</td> 
       <td>' + $LogFileCell + '</td> 
      </tr> 

     </table>     

     <table> 

      <tr> 
       <th colspan="5">Backup Report</th> 
      </tr> 

      <tr> 
       <td class="td-left-column" colspan="2">Path</td> 
       <td colspan="3">' + $BckpDir + '</td> 
      </tr> 

      <tr> 
       <td class="td-left-column" colspan="2">Save Type</td> 
       <td colspan="3">' + $SaveType + '</td> 
      </tr> 

      <tr> 
       <td class="td-left-column" colspan="2">Objects Saved</td> 
       <td colspan="3">' + $FilesSaved + '/' + $TotalBckpFiles + '</td> 
      </tr> 

      <tr> 
       <td class="td-left-column" colspan="2">Start</td> 
       <td colspan="3">' + $Date + ' // ' + $Time + '</td> 
      </tr> 

      <tr> 
       <td class="td-left-column" colspan="2">End</td> 
       <td colspan="3">' + (Get-Date -Format d) + ' // ' + (Get-Date -Format t) + '</td> 
      </tr> 

      <tr> 
       <td class="td-left-column" style="width:50px;"></td> 
       <td class="td-left-column" style="width:50px;">Task</td> 

       <td style="width:200px;text-align:center"><b>FTP Download</b></td> 
       <td style="width:200px;text-align:center"><b>WinRAR Archive</b></td> 
       <td style="width:200px;text-align:center"><b>Total</b></td> 
      </tr> 

      <tr> 
       <td class="td-left-column" style="width:50px;"></td> 
       <td class="td-left-column" style="width:50px;">RunTime</td> 

       <td style="width:200px;text-align:center">' + $FTPDLRT + '</td> 
       <td style="width:200px;text-align:center">' + $ArchiveRT + '</td> 
       <td style="width:200px;text-align:center">' + $BckpRT + '</td> 
      </tr> 

      <tr> 
       <td class="td-left-column" colspan="2">Size</td> 
       <td colspan="3">' + [System.Math]::Round(($BckpSize/1GB), 1) + ' GB</td> 
      </tr> 

      ' + $CompSize + ' 

      <tr> 
       <td class="td-left-column" colspan="2">Free Disk Space</td> 
       <td colspan="3">' + [System.Math]::Round(($BckpDsk.FreeSpace/1TB), 1) + ' TB</td> 
      </tr> 

     </table> 

     <br><br> 

     <table> 

      <tr> 
       <th style="width:100px">ID</th> 

       <th style="width:200px">File Name</th> 

       <th style="width:200px">Size</th> 

       <th style="width:200px">Status</th> 
      </tr> 

      ' + $AllFileRows + ' 

     </table> 

    </body> 

</html> 

到目前爲止,我已經通過設置邊框顏色試了一下到單元格的背景顏色,但沒有運氣。用border-bottom-style:hidden隱藏邊界也沒有工作。

更令人困惑的是,當我將border-left-color:#F0F0F0添加到<td class="td-left-column" style="width:50px;"></td>時,左邊框消失。當我嘗試爲正確的邊框做這件事時,它不起作用。

我在這裏設置了一個小提琴:https://jsfiddle.net/Lk6bf5mm/3/ 問題是,如果它在小提琴中看起來不錯,它並不意味着它在Outlook中看起來會一樣。

感謝您的任何幫助。

回答

1

可能導致您的問題的一個問題是Outlook將從您的電子郵件中刪除您的部分。確保將所有CSS內聯添加到元素中。嘗試邊框設置爲0,然後使用內聯CSS樣式邊框上各個元素:

<table border="1"> 

Outlook 2013中使用Word來顯示HTML它有不同的規則。

Word 2007 HTML and CSS Rendering Capabilities in Outlook 2007 (Part 1 of 2)

Word 2007 HTML and CSS Rendering Capabilities in Outlook 2007 (Part 2 of 2)

:什麼HTML和CSS這裏允許你可以閱讀更多關於