HTML5

语义化标签

html5 中为了提高可读性，提供了一些标签，这些标签主要针对于搜索引擎的，移动端经常使用这些标签，在 IE9 中需要把这些标签转为块元素.

<header> 头部标签
<nav>导航标签
<article>内容标签
<section>块级标签
<aside>侧边栏标签
<footer> 尾部标签

多媒体标签

音频标签

使用 <audio> 关键字，拥有属性

• src: 路径 如:src:"../audio/xx.MP3"
• controls: 如果出现该属性则向用户显示控件如播放按钮 如:controls="controls"
• autoplay: 音频加载完后自动播放 如:autoplay ="autoplay"
• loop: 循环播放 如:loop="loop"

不同的浏览器支持不同的音频格式，比如有的浏览器支持 MP3 有的只支持 ogg, 我们的解决方法是为不同浏览器提供不同的音频格式

 <audio controls="controls">
        <source src="xxx.mp3" type="audio/mpeg">
        <source src="xx.ogg" type="audio/ogg" > 
    </audio>

视频标签

使用 <video> , 拥有属性

• src: 路径 如:src:"../audio/xx.MP4"
• controls: 如果出现该属性则向用户显示控件如播放按钮 如:controls="controls"
• autoplay: 视频加载完后自动播放 如:autoplay ="autoplay" 谷歌中默认禁用自动播放，只需静音播放即可
• loop: 循环播放 如:loop="loop"
• poster: 加载等待的图片 如:poster:"图片路径"
• muted: 静音播放 如:muted="muted"
• preload: 是否加载完再播放 如:preload="preload"

同样有格式冲突，与音频处理方法一致

​

表单属性

• type="email" : 限定用户使用 email 类型
• url; url 类型
• date 日期类型
• time 时间类型
• month 月类型
• week 周类型
• number; 必须为数字
• tel 手机号码
• search 搜索框 可以快速清除输入框内容
• color 颜色选择

表单

• required: 其内容不能为空 如:required="required"
• placeholder: 提示文本，光标在表单或存在值则不显示 如:placeholder="请输入用户名"
• autofocus: 自动聚焦，页面加载完光标自动聚焦在此表单 如:autofocus="autofocus"
• autocompleate: 浏览器根据之前键入的值，出现提示，默认是打开，有 on 和 off 选项，同时需要在表单内设置 name 属性 如:autocompleate:off;
• multiple: 可以多选文件提交 如:multiple="multiple"