table(表格)边框改为细线

最新推荐文章于 2024-07-24 15:51:28 发布

水沉草木

最新推荐文章于 2024-07-24 15:51:28 发布

阅读量1.8k

点赞数

文章标签： elementui webview postman

本文链接：https://blog.csdn.net/qq_69761234/article/details/124931094

版权

上一个文章中介绍了table(表格)的一些基本属性，但是制作出来的是边框挺不美观的如下：

在补充两个属性：

colspan 水平方向单元格的合并

rowspan 上线方向单元格的合并

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<table border="1" width="400" height="300" align="center" >
			<thead>
				<tr>
				<th colspan="3">学生成绩</th>
				
				</tr>
			</thead>
			<script href=""></script>
			<tbody>
				<tr>
					<td rowspan="2" align="center">张三</td>
					<td>语文</td>
					<td>98</td>
				</tr>
				<tr>
					
					<td>数学</td>
					<td>95</td>
				</tr>
				<tr>
					<td>李四</td>
					<td>语文</td>
					<td>88</td>
				</tr>
				<tr>
					<td>李四</td>
					<td>数学</td>
					<td>91</td>
				</tr>
			</tbody>
			<tfoot>
				<tr>
					<td colspan="3">表格底部</td>
				</tr>
			</tfoot>
		</table>
	</body>
</html>

这是可以使用cellspacing，

cellspacing：用来指定表格各单元格之间的空隙。此属性的参数值是数字，表示单元格间隙所占的

像素点数。

<table style ="border-collapse: collapse" cellspacing =0 border="1" width="400" height="300" align="center">

水沉草木

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
table(表格)边框改为细线

上一个文章中介绍了table(表格)的一些基本属性，但是制作出来的是边框挺不美观的如下：在补充两个属性： colspan 水平方向单元格的合并 rowspan 上线方向单元格的合并<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body...
复制链接

扫一扫