我正在尝试创建一个带有 1px 黑色边框的表格。
我必须在主表中嵌套一个表，并在下一个表与其封闭的<td>. 我只想要一个 1px 的边框。
我有这个，实际上：
table.outer{border:1px black solid; border-collapse: collapse;}
td{border:1px black solid; border-collapse: collapse;}
table.nexted{border:1px black solid; border-collapse: collapse;}
如果我理解正确，您可以使用border-left、border-right、border-top 和border-bottom 来创建您想要的这些“特殊”情况。
例如，在您的嵌套表中，您可以设置
border-left:0;
在嵌套表的左侧获得“结果”1 px 边框。
为您的嵌套表格提供无边框样式
<!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>
<title></title>
<style type="text/css">
table.outer
{
border: 1px black solid;
border-collapse: collapse;
width: 100%;
}
table.outer td
{
border: 1px black solid;
border-collapse: collapse;
}
table.nested, table.nested td
{
border-width: 0px;
border-collapse: collapse;
width: 100%;
}
</style>
</head>
<body>
<table class="outer">
<tr>
<td>
<table class="nested">
<tr>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
</tr>
</table>
</td>
<td>
content
</td>
</tr>
<tr>
<td>
content
</td>
<td>
<table class="nested">
<tr>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
只需将边框属性放在tds 上即可。如果你想要一个 1px 的边框，那就可以了；你不需要它在桌子上。
这个页面描述了如何做得很好： http: //www.visakopu.net/misc/table-border-css/
发生的情况是单元格上的边界相互碰撞，导致边界看起来比实际更厚。不使用border-collapse 属性，而是在表格本身上设置边框，并且只在顶部和左侧设置边框，并在单元格的底部和右侧设置边框。