摘要：
1.select下拉框
2.textarea文本域
3.iframe小页面
4.video视频控件
5.audio音频控件
6.input的控件：list（模糊查询）、email、datetime-local、week
下拉框：select
里面的每一项用option
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
籍贯:<select name="" id="">
<option value="">--请选择--</option>
<option value="浙江">浙江</option>
<option value="四川">四川</option>
<option value="广东">广东</option>
</select>
</body>
</html>
文本域：textarea
范围：rows确定行数，cols确定列数
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
说说你的想法:<br />
<textarea rows="3" cols="24">
</textarea>
</body>
</html>
框架的另一个标签：iframe(小页面)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<iframe src="text.html" width="400px" height="130px"></iframe>
<iframe src="text.html" width="400px" height="130px"></iframe>
</body>
</html>
HTML5和HTML4的区别
- Html5兼容性更好，不同设备之间的。
- Html5增加了很多具有实际意义的标签
多媒体控件
插入视频：video
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<video controls="controls" height="300" width="500">
<source src="img/川师公寓.mp4" type="video/mp4"></source>
</video>
</body>
</html>
controls：是否显示控件（默认不显示）
type：视频是什么格式的
添加音频：audio
controls：是否显示控件（默认不显示）
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<audio controls="controls" src="img/陈奕迅 - 爱情转移(国).mp3"></audio>
</body>
</html>
适用于模糊查询的input控件：list
list 属性引用数据列表，其中包含输入字段的预定义选项。可以自己再输入dataList控件以表的形式呈现数据
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
检索:<input list="data"/>
<datalist id="data">
<option>名人</option>
<option>悯人</option>
<option>鸣人</option>
<option>佐助</option>
</datalist>
</body>
</html>
list的值和id的值要一样，关联起来
只输入人，可以模糊查询出来名人、悯人、鸣人
【html的注释：<!-- -->】
input控件：
（1）用于填写邮箱校验：email
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<form action="text" method="post">
邮箱:<input type="email" />
<input type="submit">
</form>
</body>
</html>
（2）时间（年月日+时分）：datetime-local
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<input type="datetime-local" />
</body>
</html>
（3）看一年的第几周：week
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<input type="week" />
</body>
</html>
HTML部分简单学习就到这里，接下来学习CSS！