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

今天写了一个表格,并将表格的tr设置了边框样式border-bottom: 1px #ccc dashed;但这个css样式貌似没有取到任何作用,先让大家看一下我的html css代码

 <table>
	<tr style="border-bottom: 1px #ccc dashed;">
		<td  height="30" width="75">标题:</td>
		<td ><%=pendingRequestVO.getTitle()%></td>
	</tr>   
 </table>

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

我们必须要将table的border-collapse样式设置为collapse,代码如下:

 <table style="border-collapse: collapse;">
	<tr style="border-bottom: 1px #ccc dashed;">
		<td  height="30" width="75">标题:</td>
		<td ><%=pendingRequestVO.getTitle()%></td>
	</tr>   
 </table>

这样就解决了,亲测可用。

发布了143 篇原创文章 · 获赞 31 · 访问量 14万+

猜你喜欢

转载自blog.csdn.net/qq_42112846/article/details/103491703