<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>列表元素</title>
</head>
<body>
<!-- 列表元素分三种
1.无序列表（ul+li） -->
<ul>
<li>鸡蛋1斤</li>
<li>西瓜6个</li>
<li>矿泉水3箱</li>
</ul>
<!-- 2.有序列表 （ol+li）-->
<ol>
<li>鸡蛋1斤</li>
<li>西瓜6个</li>
<li>矿泉水3箱</li>
<li>牛肉1斤</li>
</ol>
<!-- 3.自定义列表 -->
<dl>
<dt>学校名称：</dt>
<dd>长春第三实验小学</dd>
<dt>学校地址：</dt>
<dd>长春市</dd>
<dt>学校电话：</dt>
<dd>16235421311</dd>
<dt>学校邮箱：</dt>
<dd>62352@163.con</dd>
</dl>
<ul>
<li style="list-style-type:none"> <img src="https://dfzximg01.dftoutiao.com/news/20201224/20201224151033_db8333defee8a89f39ca587b3c2eb264_1.png" height="100px" width="200px"></li>
<li style="list-style-type:none"> <img src="https://dfzximg01.dftoutiao.com/news/20201224/20201224151033_db8333defee8a89f39ca587b3c2eb264_1.png" height="100px" width="200px"></li>
<li style="list-style-type:none"> <img src="https://dfzximg01.dftoutiao.com/news/20201224/20201224151033_db8333defee8a89f39ca587b3c2eb264_1.png" height="100px" width="200px"></li>
<li style="list-style-type:none"> <img src="https://dfzximg01.dftoutiao.com/news/20201224/20201224151033_db8333defee8a89f39ca587b3c2eb264_1.png" height="100px" width="200px"></li>
</ul>
<!-- 表格 ：元素table表,caption标题,thead表头, tbody表体, tr行,td列,th列（加强列）-->
<style>
tr td{border:1px solid;} / 表框实体、黑 /
.ta{ border-collapse: collapse;} / 去掉表格间隙 /
</style>
<table class="ta" style="border:1px solid;">
<!-- 标题 -->
<caption style="color: red;">课程表</caption>
<!-- 表头 -->
<tr style="border:1px solid;">
<td></td>
<td></td>
<td>星期一</td>
<td>星期二</td>
<td>星期三</td>
<td>星期四</td>
<td>星期五</td>
</tr>
<tr>
<td rowspan="4">上午</td>
<td>1</td>
<td>语文</td>
<td>数学</td>
<td>化学</td>
<td>生物</td>
<td>地理</td>
</tr>
<tr>
<td>2</td>
<td>体育</td>
<td>美术</td>
<td>数学</td>
<td>语文</td>
<td>物理</td>
</tr>
<tr>
<td>3</td>
<td>化学</td>
<td>政治</td>
<td>历史</td>
<td>实验</td>
<td>音乐</td>
</tr>
<tr>
<td>4</td>
<td>语文</td>
<td>英语</td>
<td>数学</td>
<td>地理</td>
<td>生物</td>
</tr>
<tr><td colspan="7" align="center"> 中午休息</td></tr>
<tr>
<td rowspan="3">下午</td>
<td>5</td>
<td>英语</td>
<td>政治</td>
<td>数学</td>
<td>英语</td>
<td>生物</td>
</tr>
<tr>
<td>6</td>
<td>化学</td>
<td>自习</td>
<td>物理</td>
<td>体育</td>
<td>实验</td>
</tr>
<tr>
<td>7</td>
<td>语文</td>
<td>化学</td>
<td>数学</td>
<td>地理</td>
<td>体育</td>
</tr>
<!-- 表体 -->
<tbody>
</tbody>
</table>
<hr>
<!-- 表单 action 处理表单提交的地址 method 提交数据方式：GET明文提交用于传输不敏感数据且少量数据；POST用于提交大量数据，隐蔽传输 -->
<form action="#" method="POST" enctype="multipart/form-data">
<label for="username">用户名:</label>
<input type="text" id="username" name="" value="kioo" placeholder="username" required>
<!-- type：控件类型，name：数据变量名（键），value：数据内容（值） -->
<br>
<label for="pass">密码：</label>
<input type="password" id="pass" name="passw" value="mima" placeholder="密码不少于10位且含有数字和字母特殊字符" required>
<br>
<label for="emm">邮箱：</label>
<input type="email" id="emm" name="ema" value="2365235@QQ.com" placeholder="622102@qq.com" required>
<br>
<!-- 单选按钮，必须公用name -->
<label for="male">性别：</label>
<input type="radio" name="gender" value="male" id="male"><label for="male">男</label>
<input type="radio" name="gender" value="female" id="female"><label >女</label>
<br>
<!-- 多选按钮，name值应该写成数组形式 -->
<label for="drawing">爱好：</label>
<input type="checkbox" id="game" value="game" name="hobby[]"><label for="game">游戏</label>
<input type="checkbox" id="football" value="football" name="hobby[]"><label for="football">足球</label>
<input type="checkbox" id="baskedball" value="baskedball" name="hobby[]"><label for="baskedball">篮球</label>
<input type="checkbox" id="drawing" value="drawing" name="hobby[]"><label for="drawing">绘画</label>
<br>
<!-- 下拉菜单 selected 默认选中 -->
<label for="edu">学历:</label>
<select id="edu" name="edu">
<option value="1">初中</option>
<option value="2">高中</option>
<option value="3">本科</option>
<option value="4" selected>研究生</option>
<option value="5">博士</option>
</select>
<br>
<!-- 文件上传 -->
<label for="touxiang">头像：</label>
<input type="hidden" name="MAX_FILE_SIZE" value="62150">
<input type="file" name="pic" id="touxiang">
<br>
<label for="jieshao">自我介绍:</label>
<br>
<textarea name="jieshao" id="jieshao" cols="20" rows="10" ></textarea>
<br>
<button>提交</button>
<!--GET: http://127.0.0.1:5500/biaoge-biaodan.html?passw=mima&ema=2365235%40QQ.com -->
</form>
</body>
</html>