html 智能表单 details option,HTML5新增-页面结构状态-列表-表单-音视频-全局兼容

页面结构状态-列表-表单-音视频-全局兼容

1 HTML5 新增语义化标签

1.1 新增页面结构标签

标签名语义和功能属性单标签还是双标签header表示页面或section中的页眉双

footer表示页面或section中的页脚双

article表示文章、博客、新闻、帖子、评论等双

aside表示侧边栏双

nav表示导航双

section表示页面中的一节或文章中的一段双

总结： HTML5新增的这些结构标签就是具有语义的 div。

1.2 新增状态标签

标签名语义和功能属性单标签还是双标签meter表示静态的度量，如用量、磁盘容量、温度等max、min、value、high、low 等双

progress表示进度，如完成多少、进行多少等max、value双

meter 和 progress 什么区别？

meter 表示静态的度量，如用量、磁盘容量、温度等； progress 表示进度，如完成多少、进行多少等

1.3 新增列表标签

标签名语义和功能属性单标签还是双标签datalist定义输入框的输入提示列表双

details定义对某个问题的详细说明双

summary嵌套在 details 里面，表示要解释的问题双

① datalist 的用法

② details 的用法

如何一夜暴富？

我们大家要学习他毫无自私自利之心的精神。从这点出发，就可以变为大有利于人民的人。一个人能力有大小，但只要有这点精神，就是一个高尚的人，一个纯粹的人，一个有道德的人，一个脱离了低级趣味的人，一个有益于人民的人。

我们大家要学习他毫无自私自利之心的精神。从这点出发，就可以变为大有利于人民的人。一个人能力有大小，但只要有这点精神，就是一个高尚的人，一个纯粹的人，一个有道德的人，一个脱离了低级趣味的人，一个有益于人民的人。

1.4 新增注释标签(注音标签)

标签名语义和功能属性单标签还是双标签ruby注音标签双

rt嵌套在ruby的里面，定义注音双

今天学了一个成语

魑chi

魅mei

魍wang

魉liang

1.5 新增文本标签

标签名语义和功能属性单标签还是双标签mark定义标记双

注意： mark 推荐用于在搜索结果中标记关键字。

2 HTML5 表单新增功能

2.1 表单控件新增属性

placeholder： 给可以输入的表单控件指定文字提示。 用于文本框、密码框、文本域等。

required： 设置该表单控件必填，否则表单无法提交； 该属性使用的时候无需给值； 适用于所有的表单控件。

autofocus： 设置该表单控件自动获取焦点； 该属性使用的时候无需给值；适用于所有的表单控件。

autocomplete： 设置浏览器是否记录输入框的历史输入； 属性的值可以设置为 on(默认值) 或者 off(不记录)。

pattern： 设置该表单控件的验证规则，值要指定正则表达式，适用于可以输入的表单控件。

2.2 input 标签的 type 属性新增的值

之前学过的 type 属性的值： text、password、radio、checkbox、submit、reset、button 。

HTML 5 新增的 type 属性的值： email、url、number、search、tel、range、color、date、month、week、time、datetime-local

① 文本输入类

② 范围选择框

③ 颜色选择框

④ 时间日期选择类

2.3 form 标签新增属性

novalidate： 用于设置表单不需要验证；该属性无需给值。

3 HTML5 音视频

3.1 音视频标签

标签名功能和语义属性单标签还是双标签video视频src： 指定视频文件地址。

controls： 显示控制条，无需给值

muted： 设置静音，无需给值

autoplay： 设置自动播放，无需给值。

loop： 设置循环播放，无需给值。

preload： 设置视频预先加载，无需给值。

poster： 设置视频封面，指定一个图片的地址。

width： 设置视频宽。

height： 设置视频高。双标签

audio音频src： 指定音频频文件地址。

controls： 显示控制条，无需给值

muted： 设置静音，无需给值

autoplay： 设置自动播放，无需给值。

loop： 设置循环播放，无需给值。

preload： 设置视频预先加载，无需给值。双标签

source加载音频或视频

嵌套在audio或者video的里面src： 指定音频或视频文件的地址

type： 指定视频或视频的类型单标签

注意：

视频或音频能够自动播放的前提是，设置静音；这是浏览器做出的规定。

默认情况下，点击播放按钮的时候，才会下载视频或音频文件，如果设置了 preload 属性，页面一打开就开始下载视频或音频文件。

3.2 浏览器支持的音视频格式

① 视频格式

mp4所有浏览器都支持，推荐

webm

ogg

② 音频格式

mp3所有的浏览器都支持，推荐

wav

ogg

4 HTML5 新增全局属性

contenteditable 属性： 设置元素中文本内容可以编辑；值：yes 或者 no。

hidden 属性： 隐藏元素，无需给值。

5 HTML5 兼容性方案

5.1 设置元信息

5.2 html5shiv.js 让IE8以及以下的浏览器支持H5新标签

关于找一找教程网

本站文章仅代表作者观点，不代表本站立场，所有文章非营利性免费分享。

本站提供了软件编程、网站开发技术、服务器运维、人工智能等等IT技术文章，希望广大程序员努力学习，让我们用科技改变世界。

[HTML5新增-页面结构状态-列表-表单-音视频-全局兼容]http://www.zyiz.net/tech/detail-164839.html