标签：控件 浏览器 标签 特性 表单 HTML5 播放 属性
HTML5新特性
文章内容输出来源：拉勾教育大前端就业急训营
HTML5优势
- 提高可用性和用户体验
- 更好的语义化标签
- 更多的多媒体元素
- 替代flash、SilverLight
- 对于搜索引擎优化SEO友好
- 多应用于移动应用程序和游戏
- 可移植性好
新增语义化标签
| 标签 | 名称 |
|---|---|
| <header> | 头部标签 |
| <nav> | 导航标签 |
| <main> | 主体部分标签 |
| <article> | 独立的内容标签 |
| <section> | 区域标签，与div类似，但section语义化 |
| <aside> | 侧边栏标签 |
| <footer> | 脚部标签 |
多媒体音频标签<audio>
| 属性名 | 属性值 | 作用 |
|---|---|---|
| src | rul | 音频文件的路径 |
| controls | controls | 显示控件，即播放条 |
| autoplay | autoplay | 自动播放（在Chrome中无效） |
| loop | loop | 循环播放 |
| preload | preload | 自动预加载，若设置了autoplay，那么preload无效 |
因为<audio>标签中音频文件的三种格式（mp3、ogg、wav）并不是每个浏览器都支持的，所以需要使浏览器兼容，方法如下：
<audio controls="controls">
<source src="audio1.mp3" type="audio/mpeg">
<source src="audio1.ogg" type="audio/ogg">
<!-- 当用户的浏览器两个格式的文件都不支持时，需要作出提示 -->
您浏览器版本过低，不支持音频播放
</audio>
多媒体视频标签<video>
| 属性名 | 属性值 | 作用 |
|---|---|---|
| src | rul | 视频文件的路径 |
| controls | controls | 显示控件，即播放条 |
| autoplay | autoplay | 自动播放（Chrome在muted的情况下支持自动播放） |
| loop | loop | 循环播放 |
| preload | auto/none | 自动预加载，若设置了autoplay，那么preload无效 |
| muted | muted | 静音播放 |
| poster | Imgurl | 视频加载时显示的图片 |
| width | px值 | 视频窗口的宽度 |
| height | px值 | 视频窗口的高度 |
因为<video>标签中音频文件的三种格式（mp4、ogg、webm）并不是每个浏览器都支持的，所以需要使浏览器兼容，方法如下：
<video controls="controls">
<source src="video.mp4" type="audio/mp4">
<source src="video.ogg" type="audio/ogg">
<!-- 当用户的浏览器两个格式的文件都不支持时，需要作出提示 -->
您浏览器版本过低，不支持视频播放
</video>
新增表单标签
- 新增的 <input> type属性值
type属性值 作用 email 输入邮箱类型 url 输入url类型 date 输入年月日 time 输入时间类型 month 输入年月 week 输入年周 number 输入数字类型（可设最大值max=""，最小值min=""） range 滑动条 tel 手机号码 search 搜索框 color 颜色选择表单 - <datalist>标签
- 规定了<input>元素可能的选项列表
- 语法规则：需要给datalist标签添加id属性，给关联的input标签添加属性值为datalist的id属性值的list属性
<input type="text" list="city-list"> <datalist id="city-list"> <option value="广州"></option> <option value="深圳"></option> <option value="上海"></option> </datalist> - 新增的表单控件属性
属性名 属性值 作用 required required 将表单控件设置为必填项 placeholder 提示文本 表单的提示信息，存在value时，placeholder的文本不显示 autofocus autofocus 自动聚焦 autocomplete off/on 控件需要有name属性且之前提交过数据，autocomplete才能起作用 multiple multiple 可多选文件提交
标签：控件,浏览器,标签,特性,表单,HTML5,播放,属性 来源： https://blog.csdn.net/m0_44994424/article/details/112585359
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。