1.合并单元格边框 border-collapse:collapse;
table{ border-collapse:collapse; /* 合并单元格边框 */ } table td{ border:1px solid #666; }
2.table中的其他元素
caption:表格的标题
thead:表格的表头
th:表格的表头单元格
tbody:表格的主体
tfoot:表格的页脚
3.单元格合并
colspan:跨列合并单元格
rowspan:跨行合并单元格
<table> <tr> <td colspan=‘2‘>单元格1</td> <!-- 跨列合并 --> <td>单元格3</td> </tr> <tr> <td rowspan="2">单元格1</td> <!-- 跨行合并 --> <td>单元格2</td> <td>单元格3</td> </tr> <tr> <td>单元格2</td> <td>单元格3</td> </tr> </table>
4.设置单元格之间的水平,垂直间距: border-spacing
table{ border-spacing:20px; /* 单元格之间会有上下左右的20px的间距 */ }
原文:https://www.cnblogs.com/rans/p/12805778.html