css border-collapse:collapse解决表格tr边框无效的问题

今天写了一个表格，并将表格的tr设置了边框样式border:2px solid red; 但这个css样式貌似没有取到任何作用，百思不得其解。先让大家看一下我的html css代码：

<html>
<head>
<title>http://www.manongjc.com/article/1212.html</title>
<style>
table{width:300px; height:200px;}
tr{border:2px solid #000;}
</style>
</head>
<body>
<table>
	<tr>
    	<td>码农教程</td>
    	<td>css教程</td>
    	<td>html教程</td>
    	<td>java教程</td>
    </tr>
	<tr>
    	<td>码农教程</td>
    	<td>css教程</td>
    	<td>html教程</td>
    	<td>java教程</td>
    </tr>
</table>
</body>
</html>

运行结果如下：

从图中可以看出tr{border:2px solid #000;}样式并没有取作用，什么原因呢？后来结果查阅资料才知道，我们必须要将table的border-collapse样式设置为collapse

正确代码：

<html>
<head>
<title>http://www.manongjc.com/article/1212.html</title>
<style>
table{width:300px; height:200px;border-collapse:collapse;}
tr{border:2px solid #000;}
</style>
</head>
<body>
<table>
	<tr>
    	<td>码农教程</td>
    	<td>css教程</td>
    	<td>html教程</td>
    	<td>java教程</td>
    </tr>
	<tr>
    	<td>码农教程</td>
    	<td>css教程</td>
    	<td>html教程</td>
    	<td>java教程</td>
    </tr>
</table>
</body>
</html>

结果：