如何删除表中的所有边框?

时间:2013-10-23 21:20:09

标签: html css

继承我的代码:

<table border="0">
    <tbody>
        <tr style="border: none;">
            <td colspan="12" align="center">2012</td>
            <td colspan="12" align="center">2013</td>
        </tr>
        <tr>
            <td align="center" style="width: 31px;border: none;">Ene</td>
            <td align="center" style="width: 29px;border: none;">Feb</td>
            <td align="center" style="width: 31px">Mar</td>
            <td align="center" style="width: 30px">Abr</td>
            <td align="center" style="width: 31px">May</td>
            <td align="center" style="width: 30px">Jun</td>
            <td align="center" style="width: 31px">Jul</td>
            <td align="center" style="width: 31px">Ago</td>
            <td align="center" style="width: 30px">Sep</td>
            <td align="center" style="width: 31px">Oct</td>
            <td align="center" style="width: 30px">Nov</td>
            <td align="center" style="width: 31px">Dic</td>
            <td align="center" style="width: 31px">Ene</td>
            <td align="center" style="width: 28px">Feb</td>
            <td align="center" style="width: 31px">Mar</td>
            <td align="center" style="width: 30px">Abr</td>
            <td align="center" style="width: 31px">May</td>
            <td align="center" style="width: 30px">Jun</td>
            <td align="center" style="width: 31px">Jul</td>
            <td align="center" style="width: 31px">Ago</td>
            <td align="center" style="width: 30px">Sep</td>
            <td align="center" style="width: 31px">Oct</td>
            <td align="center" style="width: 30px">Nov</td>
            <td align="center" style="width: 31px">Dic</td>
        </tr>
        <tr>
            <td style="background-color: #000;border: none;">&nbsp;</td>
            <td style="background-color: #000;border: none;">&nbsp;</td>
        </tr>
    </tbody>
</table>

http://jsfiddle.net/GWj3w/2/

正如你所看到的,我将表格中的边框设置为0,并将tr和td标签的样式设置为border:none但我仍然在单元格之间获得白线,也是我放置的样式

* {
    border: none;
    padding: 0;
    margin: 0;
}

如何删除此边框??

谢谢!

2 个答案:

答案 0 :(得分:3)

您可以使用其中任何一个删除空格(注意:两者之间有轻微的difference

在桌子上

border-spacing: 0;border-collapse: collapse;

示例:http://jsfiddle.net/GWj3w/1/

答案 1 :(得分:1)

轻松修复!在table元素上将cellpadding和cellspacing设置为0。所有边框调整都可能令人困惑,而且您无需控制<tr>边框调整。保持简单:)