请注意： 在现代 Web 开发中，强烈推荐使用 CSS 来控制表格的样式（如边框、内边距、对齐、背景色等），而不是使用这些过时的 HTML 属性。这些属性是为了向后兼容和在无法使用 CSS 的极少数情况下保留的。使用 CSS 可以更好地分离结构（HTML）和表现（CSS），使代码更清晰、更易于维护和更具灵活性。
示例 1：基础表格（带边框）
使用 border="1" 属性来显示表格的基本边框。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>基础表格 (无 CSS)</title>
</head>
<body>
<h2>联系人列表 (纯 HTML)</h2>
<table border="1"> <!-- border="1" 显示一个简单的边框 -->
<tr>
<th>姓名</th>
<th>邮箱</th>
<th>电话</th>
</tr>
<tr>
<td>张三</td>
<td>zhangsan@example.com</td>
<td>138********</td>
</tr>
<tr>
<td>李四</td>
<td>lisi@example.com</td>
<td>139********</td>
</tr>
</table>
</body>
</html>
示例 2：带语义分组和标题的表格（带边框）
展示 <thead>, <tbody>, <tfoot>, 和 <caption> 的用法，同样使用 border="1"。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>语义化表格 (无 CSS)</title>
</head>
<body>
<h2>产品价格表 (纯 HTML)</h2>
<table border="1">
<caption>各种水果价格</caption> <!-- 表格标题 -->
<thead>
<tr>
<th>水果名称</th>
<th>单价 (元/斤)</th>
<th>库存状态</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="3">注：价格可能随时变动</td> <!-- 表格脚注，跨越3列 -->
</tr>
</tfoot>
<tbody>
<tr>
<td>苹果</td>
<td>8.5</td>
<td>有货</td>
</tr>
<tr>
<td>香蕉</td>
<td>4.0</td>
<td>有货</td>
</tr>
<tr>
<td>草莓</td>
<td>25.0</td>
<td>少量</td>
</tr>
</tbody>
</table>
</body>
</html>
示例 3：单元格合并（带边框）
演示 colspan 和 rowspan 的使用，仍然依赖 border="1" 显示结构。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>单元格合并 (无 CSS)</title>
</head>
<body>
<h2>课程时间表片段 (纯 HTML)</h2>
<table border="1">
<tr>
<th>时间</th>
<th>星期一</th>
<th>星期二</th>
<th>星期三</th>
</tr>
<tr>
<td>上午 9:00-10:00</td>
<td rowspan="2">数学（连上两节）</td> <!-- 跨越 2 行 -->
<td>英语</td>
<td>物理</td>
</tr>
<tr>
<td>上午 10:00-11:00</td>
<!-- 数学单元格已在上行定义，这里不需要 -->
<td>体育</td>
<td>化学</td>
</tr>
<tr>
<td>中午 12:00-1:00</td>
<td colspan="3">午餐休息时间</td> <!-- 跨越 3 列 -->
</tr>
</table>
</body>
</html>
示例 4：使用更多已弃用的 HTML 属性（不推荐）
这个例子使用了 cellpadding, cellspacing, width, align, bgcolor 等现已不推荐使用的属性来改变表格外观。请注意，这些属性在现代浏览器中可能表现不一致，并且严重违反了结构与表现分离的原则。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>使用过时属性的表格 (不推荐)</title>
</head>
<body>
<h2>演示过时属性 (不推荐使用)</h2>
<table border="1"
cellpadding="10" <!-- 单元格内容到边框的距离 -->
cellspacing="0" <!-- 单元格之间的距离 (0表示合并边框效果) -->
width="400" <!-- 表格宽度 -->
align="center" <!-- 表格在页面中居中对齐 -->
bgcolor="#f0f0f0"> <!-- 表格背景色 (可能只对单元格有效) -->
<caption>演示表格</caption>
<thead>
<tr bgcolor="lightblue"> <!-- 行背景色 -->
<th>标题 1</th>
<th>标题 2</th>
</tr>
</thead>
<tbody>
<tr>
<td align="right">数据 1 (右对齐)</td> <!-- 单元格内容对齐 -->
<td>数据 2</td>
</tr>
<tr>
<td>数据 3</td>
<td bgcolor="lightgreen">数据 4 (单元格背景色)</td>
</tr>
</tbody>
</table>
<p><strong>重要提示：</strong> 上述表格中使用的 `cellpadding`, `cellspacing`, `width`, `align`, `bgcolor` 等属性都是**已过时 (deprecated)** 的 HTML 属性。在现代 Web 开发中，您应该使用 **CSS** 来控制表格的样式和布局，以实现更好的代码分离、可维护性和响应式设计。</p>
</body>
</html>
总结：
- 你可以仅使用 HTML 创建表格的基本结构 (
<table>, <tr>, <th>, <td>, <thead>, <tbody>, <tfoot>, <caption>)。 - 可以使用 border="1" 属性（虽然也已不推荐）来快速显示表格的边框，以便在没有 CSS 的情况下查看结构。
- colspan 和 rowspan 用于合并单元格，这是 HTML 结构的一部分，不是样式。
- 避免使用 cellpadding, cellspacing, width, align, bgcolor 等纯粹用于表现的 HTML 属性。始终优先使用 CSS 来进行表格样式设计。
