html5新增常用标签

HTML5

HTML5新增的语义化标签

• header：头部标签
• nav：导航标签
• article:内容标签
• section：定义文件某个区域标签
• aside：侧边栏标签
• footer:尾部标签

注意：

• 这汇总语义化标签主要是针对搜索引擎的
• 这些新标签页面可以使用多次
• 在IE9中，需要把这些元素转化为块级元素
• 其次，我们移动端更喜欢我们用这些标签

HTML5新增的媒体标签

1.音频：audio

2.视频：video

使用他们可以很方便的嵌入音频和视频，而不再去使用flash和其他视频浏览器插件

视频video

当前vidio元素支持三种视频格式，尽量使用mp4格式

浏览器	MP4	webm	ogg
Internet exploer	yes	no	no
Chrome	yes	yes	yes
Firefox	yes	yes	yes
safari	yes	no	no
opera	yes	yes	yes

语法：

<video src=“文件地址” controls=“controls”></video>

常见属性：

属性	值	描述
autoplay	autoplay	视频就绪自动播放（谷歌需要插件muted来解决自动播放问题）
controls	controls	向用户显示播放控件
width	像素	设置播放器宽度
height	像素	设置播放器高度
loop	loop	播放完是否循环播放视频
preload	auto(预先加载视频)，none（不预先加载）	规定是否预加载视频（如果有了autoplay就忽略该属性）
src	url	视频地址
poster	imgurl	加载等待的图片
muted	muted	静音播放

音频标签

当前audio元素支持三种音频格式

浏览器	MP4	wav	ogg
Internet exploer	yes	no	no
Chrome	yes	yes	yes
Firefox	yes	yes	yes
safari	yes	yes	no
opera	yes	yes	yes

格式：

<audio src=“文件地址” controls=“controls”></audio>

常见属性：

属性	值	描述
autoplay	autoplay	自动播放音频
controls	controls	向用户展示控件
loop	loop	循环播放
src	url	要播放音频的url

新增的input类型

属性值	说明
email	限制输入用户必须为email类型
url	限制用户输入必须为url类型
date	限制用户输入必须为日期类型
time	限制用户输入必须为时间类型
month	限制用户输入必须为月类型
week	限制用户输入必须为周类型
number	限制用户输入必须为数字类型
tel	限制用户输入手机号码
search	限制用户输入搜索框
color	生成一个颜色选择表单

新增的表单属性

属性	值	说明
required	required	表单拥有该属性表示其内容不能为空，必须填
placeholder	提示文本	表单提示信息，存在默认值将不显示
autofocus	autofocus	自动聚焦属性，页面加载完成自动聚焦到指定表单
autocomplete	off/on	当用户开始键入时，浏览器基于之前键入过的值，应该显示出在字段中填写的选项.
multiple	multiple	可以多选文件提交