今天写了一个表格，并将表格的tr设置了边框样式border:2px solid red; 但这个css样式貌似没有取到任何作用，百思不得其解。先让大家看一下我的html css代码：
<html>
<head>
< >http://www.manongjc.com/article/1212.html</ >
<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>
运行结果如下：
![\"css](\"/images/css-border-collapse-1212_1.png\")
从图中可以看出tr{border:2px solid #000;}样式并没有取作用，什么原因呢？后来结果查阅资料才知道，我们必须要将table的border-collapse样式设置为collapse
正确代码：
<html>
<head>
< >http://www.manongjc.com/article/1212.html</ >
<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>
结果：
![\"css](\"/images/css-border-collapse-1212_2.png\")
继续阅读与本文标签相同的文章
-
他让我国芯片研究停滞13年，还骗走11亿研发资金，现状如何？
2026-05-14栏目： 教程
-
健乐教学机器人可开展的教学实训内容
2026-05-14栏目： 教程
-
5G套餐曝光遭“吐槽”，iphone11受追捧，导致苹果11销量比较高
2026-05-14栏目： 教程
-
为什么修电脑的叫自己不要杀毒和清理垃圾？
2026-05-14栏目： 教程
-
当水乡建筑遇上机器人，成就乌镇又一网红景点
2026-05-14栏目： 教程