2015-04-01 107 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这里允许你可以阅读更多关于