去除 HTML 电子邮件中的表格边框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5303254/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Getting Rid of Table Borders in HTML Emails
提问by Ben
I'm working on an HTML email campaign (no CSS allowed) so I'm forced to use tables, something I'm not super familiar with. I've got everything looking right EXCEPT the table borders. Whenever I create a new <tr>I cannot for the life of me get rid of the inner border around the content. I have tried a few tricks (border="0px", bordercolor="white", bordercolor="#ffffff", etc), but whenever I send a test message, the borders still show up black around my text and images.
我正在处理一个 HTML 电子邮件活动（不允许使用 CSS），所以我不得不使用表格，这是我不太熟悉的。除了表格边框外，我的所有内容看起来都正确。每当我创建一个新内容时，<tr>我都无法摆脱内容周围的内边界。我尝试了一些技巧（border="0px"、bordercolor="white"、bordercolor="#ffffff"等），但是每当我发送测试消息时，我的文本和图像周围的边框仍然显示为黑色。
This is really messing with my design flow. Is there any trick I don't know to getting rid of HTML table borders? Help!
这真的扰乱了我的设计流程。有什么我不知道的技巧可以摆脱 HTML 表格边框吗？帮助！
回答by nav bhullar
<table border="0" cellpadding="0" cellspacing="0" width="100%" style = "border-collapse: collapse;">
回答by Deepak Patel
Apply this:
应用这个：
style = "border-collapse: collapse;"
To every table cell, the border should not be visible anymore.
对于每个表格单元格，边框不应再可见。
回答by ziv
If the content is an image, try <td valign="top">for all <td>with images inside.
Besides that, the table tag should be <table cellpadding="0" cellspacing="0" ...>. One more tip, use inline style for the borders that you want.
如果内容是图像，请尝试<td valign="top">所有<td>包含图像的内容。除此之外，表格标签应该是<table cellpadding="0" cellspacing="0" ...>. 还有一个技巧，对你想要的边框使用内联样式。
回答by Unambiguous
To get rid of the table borders, use <table border="0">.
要去除表格边框，请使用<table border="0">.
回答by Grant Coombs
Use <table border="0">without px?
<table border="0">不使用px？
回答by John
Try this:
尝试这个：
In head:
在头：
<style type="text/css">
table td {border-collapse: collapse;}
</style>
Table:
桌子：
<table width="300" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF" style="border:2px solid #000000;">
<tr>
<td width="50%" bgcolor="#999999" style="padding:20px;">
...
</td>
<td width="50%" bgcolor="#888888" style="padding:20px;">
...
</td>
</tr>
<tr>
<td width="50%" bgcolor="#777777" style="padding:20px;">
...
</td>
<td width="50%" bgcolor="#666666" style="padding:20px;">
...
</td>
</tr>
</table>
Also, always keep cellpadding and cellspacing at zero. Use padding in your cells if you want spacing.
此外，始终将 cellpadding 和 cellpacing 保持为零。如果需要间距，请在单元格中使用填充。
回答by Czechnology
How about
怎么样
<table style="border-collapse: collapse;">
<!-- ... -->
</table>
? Such inline CSS should work fine even in HTML email.
? 即使在 HTML 电子邮件中，这种内联 CSS 也应该可以正常工作。
回答by pork-chop
Just came across this tip that actually works (at least for iOS):
刚刚遇到这个实际有效的提示（至少对于 iOS）：
To prevent [hairline borders] from happening nest the problematic table into a new table with a background color that matches that of the inner table.
为了防止发生[细线边框]，将有问题的表格嵌套到一个背景颜色与内表格相匹配的新表格中。
Source: http://www.informz.com/blog/template-design/quick-tip-removing-hairline-borders-in-html-emails-on-iphone-ipad/(includes photos of source code)
来源：http: //www.informz.com/blog/template-design/quick-tip-removing-hairline-borders-in-html-emails-on-iphone-ipad/（包括源代码照片）
