表格
基本语法：
1. <table></table>用于定义表格的标签
2.·<tr></tr>用于定义表格的行，必须嵌套在 <table></table>标签中
3.<td></td>用于定义表格的单元格，必须嵌套在<tr></tr>标签中
4.<th></th>tr标签表示表格的表头单元格，位于表格的第一行或第一列，表头单元格里的文本内容加粗居中显示，必须嵌套在<tr></tr>标签中
表格属性：(放在<table>的开始标签中)
属性名=“属性值”
1.align,可以取left, center, right,用来规定表格在浏览器窗口的位置
2.border,可以取1或“ ” ,用来规定表格单元是否有边框，默认是“ ”，无边框
3.cellpadding,可以取像素值 ,用来规定表格的单元边缘与其内容之间的空白，默认是1像素（在HTML中属性值是不用写单位的）
4.cellspacing,可以取像素值 ,用来规定表格的单元格之间的空白，默认2像素
5.width和hight,可以取像素值或百分比 ,用来规定表格的宽度和高度
表格的结构标签
1.当表格很长时，为了更好的表示表格的语义，可以将表格分割成表格头部和表格主体两大部分
2.<thead></thead>标签容纳表格的头部区域，其内部必须用于拥有<tr>标签，一般是位于第一行
3.<tbody></tbody>标签容纳表格的主体部分
4.以上标签都放在<table></table>标签中
合并单元格
1.合并方式：
1.跨行合并：rowspan="合并单元格的数目"
2.跨列合并：colspan="合并单元格的数目"
找目标单元格（写合并代码）（好理解）
1.跨行：最上侧的单元格为目标单元格，写合并代码
2.跨列：最左侧的单元格为目标单元格，写合并代码
合并单元格
- 先确定是跨行还是跨列
- 找到目标单元格，写合并方式。
<td colspan="2"></td> - 删除多余的单元格
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
<table align="center" width="400" hight="400" border="1" cellspacing="0" cellpadding="2">
<thead>
<tr>
<th colspan="3">单元格的学习，表头</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
</tbody>
</table>
</body>
</html>
列表
1.无序列表：<ul></ul>
1.使用<ul>标签来定义无序列表，列表项用<li>列表项的内容</li>标签来定义
2.<ul>标签中只能嵌套<li></li>，不允许在其中嵌套其他标签
3.而<li></li>标签中可以容纳其他标签，相当于一个容器
4.无序列表会带有自己的样式属性，在实际应用中通过css来设置
<ul>
<li>
<p></p>
<p></p>
</li>
<li></li>
</ul>
</body>
2. 有序列表：<ol></ol>
1.使用<ol>标签来定义无序列表，列表项用<li>列表项的内容</li>标签来定义
2.<ol>标签中只能嵌套<li></li>，不允许在其中嵌套其他标签
3.而<li></li>标签中可以容纳其他标签，相当于一个容器
4.有序列表会带有自己的样式属性，在实际应用中通过css来设置
<body>
<ol>
<li>
<p></p>
<p></p>
</li>
<li></li>
</ol>
</body>
自定义列表
1.常使用于对术语或者名词进行描述和解释，自定义列表的列表前没有任何的项目符号
2.<dl></dl>标签来定义* 自定义列表*，该标签会与<dt></dt>(定义项目/名字)和<dd></dd>(描述每一个项目/名字)一起使用
3.<dl></dl>里面只能包含<dt>和<dd>
4.<dt>和<dd>的个数没有限制，经常是一个<dt>对应多个<dd>
5.<dt>与<dd>并不是包含关系，是大哥与小弟的形式，一般<dt>大哥</dt>的字体会比<dd>小弟<dd>的大一些，一般是大哥在上方，小弟们排在它的下方，起着对大哥有解释和说明的作用
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
<dl>
<dt>联系方式</dt>
<dd>手机</dd>
<dd>微信</dd>
<dd>qq</dd>
</dl>
</body>
</html>
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· AI与.NET技术实操系列：基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型，支持深度思考和联网搜索！
· 基于 Docker 搭建 FRP 内网穿透开源项目（很简单哒）
· 25岁的心里话
· ollama系列01：轻松3步本地部署deepseek，普通电脑可用
· 按钮权限的设计及实现