JavaWeb_HTML（7）_HTML 的表格

最新推荐文章于 2024-08-10 00:37:06 发布

魏宇轩

最新推荐文章于 2024-08-10 00:37:06 发布

阅读量1.6k

点赞数

分类专栏： HTML（更新完）文章标签： JavaWeb HTML 表格

本文链接：https://blog.csdn.net/qq_36260974/article/details/88368007

版权

HTML（更新完）专栏收录该内容

21 篇文章 2 订阅

订阅专栏

本系列博客汇总在这里：JavaWeb_HTML 汇总

一、表格标签（table）

属性

border：表格的边框，默认是 0。
width：表格的宽度；既可以给像素,还可以给百分比（占整个屏幕）。
height：表格的高度；既可以给像素,还可以给百分比（占整个屏幕）。
align：水平位置 left,center,right。
子标签（caption）：表格的标题。

二、表格的行标签（tr）

子标签

th：标题列标签，加粗并居中。
td：每一行的列标签，单元格，默认是居左。

三、表格边框的设置

border：表格的外边框粗细。
cellspacing：表格的内边框粗细，单元格直接的间距。
cellpadding：设置文字到单元格的距离。

四、表格相关颜色的设置

bordercolor：边框颜色。
bgcolor：背景色。

五、表格的内容的位置设置

align：文字的水平位置 left,center,right。
valign：文字的垂直位置 top,middle,bottom。

六、示例

<html>
	
	<head>
		<title>www.weiyuxuan.com</title>		
	</head>
	
	<body>
		
		<h1>HTML表格标签</h1>
		
		<table border="20" width="80%" height="30%" align="center" cellspacing="0" cellpadding="30" bgcolor="yellow" bordercolor="red">
			
			<caption>梁山好汉</caption><!--标题-->
			
			<tr><!--表头-->
				<th>姓名</th>
				<th>地址</th>
				<th>年龄</th>
			</tr>
			
			<tr align="center"><!--第一行（下面所有行都居中）-->
				<td>宋江      </td><!--第一列-->
				<td>山东郓城  </td><!--第二列-->
				<td>32        </td><!--第三列-->
			</tr>
			
			<tr><!--第二行-->
				<td align="center">晁盖  </td><!--该行居中-->
				<td>石碣村               </td>
				<td>35                   </td>
			</tr>
			
			<tr><!--第三行-->
				<td>武松     </td>
				<td>阳谷县   </td>
				<td>26       </td>
			</tr>
			
		</table>
		
	</body>
	
</html>