21,label标签
<label for="...">...</label>
<label>...</label>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 点击文字也可以选中 -->
<!-- 写法一 -->
性别: <input type="radio" id="man" name="gender" checked>
<label for="man">男</label>
<input type="radio" id="women" name="gender">
<label for="women">女</label>
<br><br>
<!-- 写法二 -->
性别: <label><input type="radio" name="gender1" checked>男</label>
<label><input type="radio" name="gender1">女</label>
</body>
</html>
22,按钮
<button type="submit">提交</button>
<button type="reset">重置</button>
<button type="button">普通按钮</button>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- form表单区域标签 -->
<form action="数据提交地址">
<!-- 按钮 -->
用户名: <input type="text" placeholder="请输入用户名"><br><br>
密码框: <input type="password" placeholder="请输入密码"><br><br>
<!-- 省略type属性,功能依然是提交 -->
<button type="submit">提交</button>
<br>
<button type="reset">重置</button>
<br>
<button type="button">普通按钮</button>
</form>
</body>
</html>
23,布局标签
<div>这是div标签</div>
<span>这是span标签</span>
网页中显示字符:**** 
显示尖括号:<和****p>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- div俗称大盒子 -->
<div>这是div标签</div>
<div>这是div标签</div>
<!-- span俗称小盒子 -->
<span>这是span标签</span>
<span>这是span标签</span>
<br><br><br>
<!-- 网页中显示字符 -->
叶上初阳干宿雨 水面清圆 一一风荷举
<br><br><br>
<!-- 显示尖括号p -->
<p>
</body>
</html>