🏆 ยอดนิยม: HRDMN/article/details/ - ประเด็นร้อน

小编作为新晋码农一枚，会定期整理一些写的比较好的代码，作为自己的学习笔记，会试着做一下批注和补充，如转载或者参考他人文献会标明出处，非商用，如有侵权会删改！欢迎大家斧正和讨论！

本篇参考CSDN博主：这么神奇-HTML表格（HTML 表格的使用，收藏这一篇就够了）的内容，文末附上原文链接！

一、代码分析

<table border="4px" cellspacing="20px" width="300px" cellpadding="80px align="center">
	<caption>个人信息表</caption>
				<tr>
					<th>姓名</th>
					<th>性别</th>
					<th>年龄</th>
				</tr>
				<tr>
					<td>张三</td>
					<td>男</td>
					<td>23</td>
				</tr>
</table>

border="4px"：数字表示边框的宽度，单位为像素
align="center"：单元格的对齐（align）（居中，左对齐，右对齐）

align 值	left	center	right
效果	左对齐	居中	右对齐

width="300px"：宽度，单位为像素

cellspacing="20px"：单元格间的距离(cellspacing)

cellpadding="80px"：单元格的边距（cellpadding）

代码运行：

二、代码块

总的代码块如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>表格table</title>
	</head>
	<body>
		<!-- 表格框架table   tr：行    数据包：td   第一行的数据包括特殊名字：th 会加粗居中-->
		<!-- caption是表名,自动居中表格中间 -->
		<!-- cellspacing是细胞与细胞之间的距离 -->
		<!-- cellpadding内容和边框之间的距离-->
		<table border="4px" cellspacing="20px" width="300px" cellpadding="80px" align="center">
				<caption>个人信息表</caption>
				<tr>
					<th>姓名</th>
					<th>性别</th>
					<th>年龄</th>
				</tr>
				<tr>
					<td>张三</td>
					<td>男</td>
					<td>23</td>
				</tr>
		</table>
		<!-- <a href="../个人主题网站/index.html"><h3 align="center">返回首页</h3></a>-->
	</body>
</html>

代码运行：