使用table、tr、td标签构建HTML表格，th定义表头，配合CSS设置边框、对齐与背景，通过colspan和rowspan实现跨列跨行，结合响应式设计优化显示效果。
在HTML中创建表格主要使用 table、tr 和 td 标签。它们分别代表表格、行和单元格。通过合理组合这些标签，并配合CSS样式，可以实现结构清晰、外观美观的表格布局。
基本HTML表格结构
一个最简单的表格由以下标签构成：
| 第一行第一列 | 第一行第二列 |
| 第二行第一列 | 第二行第二列 |
说明：
- table：定义整个表格容器
- tr：定义表格中的一行（table row）
- td：定义单元格内容（table data）
添加表头与结构优化
如果需要表头，推荐使用 th 标签替代 td，它会自动加粗并居中显示文字。
立即学习“前端免费学习笔记（深入）”；
| 姓名 | 年龄 | 城市 |
|---|---|---|
| 张三 | 25 | 北京 |
| 李四 | 30 | 上海 |
为表格添加CSS样式
直接在HTML中添加 style 属性或引用外部CSS可美化表格。
- 设置边框：
border: 1px solid #ccc; - 合并边框：
border-collapse: collapse;避免双线边框 - 设置内边距：
padding: 8px;提升可读性 - 背景与对齐：
text-align: center;或background-color: #f0f0f0;
示例样式：
常见属性与实用技巧
虽然HTML5不推荐使用部分旧属性，但了解仍有帮助：
-
colspan：跨列显示，如
- rowspan：跨行显示，如
- width / height：建议用CSS控制而非HTML属性
- 响应式处理：在小屏幕上可用
overflow-x: auto包裹表格基本上就这些。掌握 table、tr、td 的基本用法，再结合CSS，就能创建出清晰实用的网页表格。关键是结构语义正确，样式分离管理。不复杂但容易忽略细节，比如边框合并和对齐方式。
- rowspan：跨行显示，如
