H5新特性
H5新特新
一、H5 新增了语义化标签,比如 article、footer、header、nav、section
以前布局:使用div+类名 ,但是div对于浏览器来说是没有语义的
h5新增的语义化标签 (可以主要用于移动端)
-
头部标签 内容标签 块级标签
tip:在IE9中需要将会这些元素转换为块级元素 ---> header,nav,article,section,aside,footer{display: block;}
二、用于媒介回放的 video 和 audio 元素
音频 audio :
属性:
-
- controls="controls" 向用户显示音频控件(比如播放/暂停按钮)
- autoplay="autoplay" 音频在就绪后马上播放 谷歌禁用了这个属性
- loop="loop" 每当音频结束时重新开始播放
- muted="muted" 音频输出为静音
- preload = " auto / metadata / none " 音频是否默认被加载以及如何被加载
- src = "音频源"
视频 video :
属性(和音频大部分雷同,这里列举了不同的属性):
-
- height="" 设置视频播放器的高度
- muted="muted" 静音时谷歌可以自动播放
- poster="图片url" 规定视频正在下载时显示的图像,直到用户点击播放按钮。
三、新的表单控件,比如 calendar、date、time、email、url、search
新增的表单 (主要可用于手机端)
-
- type="email" 必须输入Email类型
- type="url" 必须输入URL类型
- type="date" 必须输入日期类型
- type="time" 必须输入时间类型
- type="month" 必须输入月类型
- type="week" 必须输入周类型
- type="number" 必须输入数字类型
- type="tel" 手机号码
- type="search" 搜索框
- type="color" 生成一个颜色选择表单
新增的表单属性
-
- required = "required" 表示该属性值不能为空
- placeholder = "提示文本(请输入XXX信息)" 表单的提示信息,存在默认值将不显示
- autofocus = "autofocus" 自动聚焦性,页面加载完成自动聚焦到指定表单
- autocomplete = "off / on" 表单中存在 name 属性时,且成功提交过的表单数据,默认的autocomplete = "on" 已打开,用户输入过的文本浏览器会给予提示,当 autocomplete = "off" 时就会关闭提示过去输入的文本。
- multiple = "multiple" 可以多选文件提交 (文件上传时可以用于多选文件)
还有用于绘画的 canvas 元素 和 对本地离线存储的更好的支持 两块知识点还未整理哦!ヾ(?°?°?)??