第二章：HTML5标签
1.1 废弃的标签
acronym
applet
basefont
big
center
dir
font
frame
frameset
noframes
strike
1.2 新增标签
1.2.1 语义和结构标签
a. 注释注解标签
<ruby>
英雄
<rt>ying xiong</rt>
</ruby>
b. 描述文档细节
<details>
<!-- 定义标题的 -->
<summary>中国医生</summary>
本片根据2020年抗击新冠肺炎疫情真实事件改编。讲述中国各地的白衣逆行者在这场浩大战役中纷纷挺
身而出、争分夺秒、浴血奋战在武汉前线，不顾自身安危守护国人生命安全的震撼故事
</details>c. 进度条
<progress value="0" max="100" id="pro">请升级浏览器</progress>
已完成<span id="res">0%</span>
<script>
setInterval(function(){
var pro=document.getElementById('pro')
var res=document.getElementById('res')
pro.value ++
// proValue ++;
res.innerHTML=(pro.value / 100 * 100) + '%'
if(pro.value==100){
alert('上传完成')
clearInterval(t)
}
},500)
</script>d. 导航链接标签 nav
<nav>
<a href="#">首页</a>
<a href="#">关于我们</a>
<a href="#">新闻资讯</a>
<a href="#">联系我们</a>
</nav>
e. 布局结构标签
header 定义文档的页眉部分
main 定义网页的主要内容部分
section 定义文档中的区段
article 文章内容部分
aside 定义其所处内容之外的内容，个人理解 侧边栏
footer 文档中的页脚部分
f. 内嵌框架标签 iframe
src 定义显示文档的url地址
frameborder 是否显示框架周围的边框 0 表示不显示 1表示不显示
marginHeight 定义顶部和底部的边距
marginWidth 定义左侧和右侧的边距
scrolling 是否显示滚动条 yes 显示 | no 不显示 | auto 自动
1.2.2 媒体标签
a. 视频标签 video
controls 是否显示播放面板
autoplay 自动播放 由于浏览器会拦截自动播放声音的视频，因此需要加上 muted 属性
muted 静音输出
poster 在视频为播放前，显示的图像(封面)
loop 设置视频循环播放
<!---->
<video src="sucai/tianwen.mp4" controls autoplay muted>
浏览器不支持该标签，请升级浏览器
</video>
<!--通过source标签引入视频资源-->
<video controls loop poster="sucai/shanheling.jpg">
浏览器不支持该标签，请升级浏览器
<source src="sucai/tianwen.mp4" type="video/mp4"/>
<source src="sucai/tianwen.ogg" type="video/ogg"/>
<source src="sucai/tianwen.webm" type="video/webm"/>
</video>
b. 音频标签 audio
controls 是否显示播放面板
autoplay 自动播放 由于浏览器会拦截自动播放声音的视频，因此需要加上 muted 属性
muted 静音输出
loop 设置视频循环播放
<audio id="music" src="sucai/wuji.mp3" controls loop></audio>1.2.3 表单相关
a. 表单信息分组
<!-- disabled 禁用整组表单元素-->
<fieldset disabled>
<legend>
分组标题
</legend>
</fieldset>
b. 新增输入框类型
email 邮箱 提交时对输入的内容进行邮箱格式验证，允许空值提交
url 网址 需添加网址协议，如：http或者https
number 数字类型 整数
tel 手机号 移动端生效
color 调色板 收集的数据是16进制表示的颜色方式
date 日期控件
month 月份控件 选择月份
week 周控件 选择 一年中的多少周
time 时间控件 选择一天中的时间
邮箱类型：<input type="email" name="">
网址类型：<input type="url" name="">
number：<input type="number" name="">
tel：<input type="tel" name="">
color：<input type="color" name="color">
date：<input type="date" name="">
month：<input type="month" name="">
week：<input type="week" name="">
time：<input type="time" name="">c. 新增属性
palceholder 设置输入框的提示信息
readonly 设置为只读属性
required 设置为必填
pattern 限制输入的值需满足该属性设置的正则表达式 待调试
multiple 允许一个以上的值 常用于多文件上传
autofocus 文档准备完成，自动获得焦点
d. 新增标签
label 为 input 元素定义标注
性别:<label>
<input type="radio" name="sex"> 男
</label>
<input type="radio" name="sex" id="female"><label for="female">女</label>datalist 定义选项列表
<input type="text" name="province" list="province">
<datalist id="province">
<option>北京</option>
<option>天津</option>
<option>河北</option>
</datalist>