table中使用collapse消除重复的边框问题
table加边框时，有时候有的地方是一条线，有的地方是两条线，非常难看。我们可以使用style="border-collapse: collapse;"消除重复的边框
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<style type="text/css">
table{
width: 100%;
}
table tr td {
border: solid 1px black;
text-align: center;
}
</style>
<body>
<table style="border-collapse: collapse;">
<tr>
<td>Data</td>
<td>Data</td>
<td>Data</td>
<tr>
<td>Data</td>
<td>Data</td>
<td>Data</td>
</tr>
<tr>
<td>Data</td>
<td>Data</td>
<td>Data</td>
</tr>
<tr>
<td>Data</td>
<td>Data</td>
<td>Data</td>
</tr>
</table>
</body>
</html>
效果如图所示：
