举例：
链接元素
<code>
<!-- 链接 -->
<a href="http://www.sina.com.cn">新浪网</a>
<a href="http://www.163.com" target="_blank" rel="noopener noreferrer">网易</a>
<a href="mailto:275374165@qq.com">联系邮箱</a>
<a href="tel:13555666262">联系电话</a>
<a href="404/044001900311-47329718.pdf" download="18.pdf">文档</a>
<a href="../image1.jpg" download="pic.jpg">图片</a>
####<!-- 以上这句向上查询无效，图片文件已放在上一级目录，不知为何？ -->
</code>
列表元素
<code>
<!-- 有序列表 -->
<ol>学习科目
<li>html</li>
<li>css</li>
<li>javascript</li>
<li>jquery</li>
<li>php</li>
</ol>
<ol reversed>学习科目 <!-- （倒序） -->
<li>php</li>
<li>jquery</li>
<li>javascrpit</li>
<li>css</li>
<li>html</li>
</ol>
<!-- 自定义列表 --><dl><dt>html</dt> <!-- 术语 --><dd class="">HTML5</dd><!-- 定义 --><dd>超文本标记语言</dd><!-- 定义 --><dt>css</dt><dd class="">CSS3</dd><dd class="">层叠样式表</dd><dt>javascript</dt><dd>ECMAScript 6 </dd><dd>动态脚本语言</dd><dt>jquery</dt><dd>jQuery 1.7</dd><dd>JavaScript框架/代码库</dd><dt>php</dt><dd>php 7.4</dd><dd>在服务器端执行的脚本语言</dd></dl><!-- 无序列表 --><ul><li>html</li><li>css</li><li>javascript</li><li>jquery</li><li>php</li></ul><ul type=circle><li>html</li><li>css</li><li>javascript</li><li>jquery</li><li>php</li></ul><ul type=square><li>html</li><li>css</li><li>javascript</li><li>jquery</li><li>php</li></ul><!-- 嵌套列表 --><ul><li>香蕉</li><li>苹果<ul><li>富士</li><li>水晶</li></ul></li><li>雪梨</li></ul>
</code>
表格元素
<code>
</code>
表单元素
<code>
<table border="1" cellspacing=0 align="center">
<colgroup bgcolor=lightblue>
<col>
<col>
<col bgcolor=lightpink>
<col>
<col>
</colgroup>
<caption>公司员工明细表</caption>
<thead>
<th>序号</th>
<th>部门</th>
<th>姓名</th>
<th>性别</th>
<th>岗位</th>
</thead>
<tbody><tr><td>1</td><td rowspan="3" align="center">开发部</td><td>许巍</td><td>男</td><td>研发主管</td></tr><tr><td>2</td><td>何必</td><td>男</td><td>数据分析员</td></tr><tr><td>3</td><td>翁虹</td><td>女</td><td>研发秘书</td></tr></tbody><tbody><tr><td>4</td><td rowspan="2" align="center">营销部</td><td>何鸿鑫</td><td>男</td><td>营销主管</td></tr><tr><td>5</td><td>张敏</td><td>女</td><td>营销</td></tbody><tbody><tr><td>6</td><td align="center">财会部</td><td>邓超</td><td>男</td><td>财务主管</td></tr></tbody><tfoot><td>说明</td><td colspan="4">伙食每人每月250元交财务主管，否则断炊</td></tfoot></table>
</code>
表单
<code>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
form {
padding: 20px;
width: 350px;
box-shadow: 0 0 8px #888;
border-radius: 10px;
box-sizing: border-box;
margin: auto;
background-color: lightskyblue;
display: grid;
gap: 15px;
}
</style>
</head>
<body>
<!-- 表单 -->
<form action="" method="post">
<h3>用户注册</h3>
<section><label for="username">用户名</label><inputname="username"id="username"type="text"></section><section><label for="password">口令</label><inputid=passwordtype="password"></section><section><label for="">性别</label><div><input type="radio" name="gender" ><label for="male">男</label><input type="radio" name="gender" ><label for="male">女</label></div></section><section><label for="intest">兴趣</label><div><input type="checkbox" name="hobby[]" id=""><label for="">开发</label><input type="checkbox" name="hobby[]" id=""><label for="">游戏</label><input type="checkbox" name="hobby[]" id=""><label for="">电影</label><input type="checkbox" name="hobby[]" id=""><label for="">摄影</label></div></section></form>
</body>
</html>
</code>
总结：
1、今天学习了语义化结构元素，以前学过，较为简单些，当时以为是一种老旧的元素，没想到有这么多没见过的。还有语义化的文本，我想以后会不会有更多的语义化的元素呢？
2、重温表格后又加深了印象，以前对表格的行、列合并老是记不住，特别是rowsan、colspan、cellspacing。重复重复再重复，就记住了！
3、没想到这么快就讲到表单，那是我以前最后接触的html元素，也是最令我神往的，因为它与后台搭起桥梁——交互。感觉挺神奇的!提前预习表单，看看今晚上课效果如何。