type
status
date
slug
summary
tags
category
icon
password
1 HTML5 新增标签
1.1 新增排版布局标签（最重要）
标签名 | 语义和功能 | 属性 | 单标签还是双标签 |
header | 页头 | ㅤ | 双标签 |
footer | 页脚 | ㅤ | 双标签 |
nav | 导航 | ㅤ | 双标签 |
section | 页面中的独立区域或文章中的一节 | ㅤ | 双标签 |
aside | 侧边栏 | ㅤ | 双标签 |
article | 文章、博客、评论、帖子等 | ㅤ | 双标签 |
main | 主要内容部分 | ㅤ | 双标签 |
figure | 表示一段独立的流内容，比如文章中的插图 | ㅤ | 双标签 |
figcaption | 表示 figure 中的标题 | ㅤ | 双标签 |
hgroup | 标题组（很少使用） | ㅤ | 双标签 |
注意：① W3C 标准中没有 hgroup 标签。② WHATWG 标准中没有 main 标签，所有版本 IE 均不支持 main 标签。
1.2 新增状态标签（了解）
标签名 | 语义和功能 | 属性 | 单标签还是双标签 |
meter | 静态度量 | max、min、high、low 、value、optimum 等等 | 双标签 |
progress | 动态进度 | max、value | 双标签 |
meter 和 progress 什么区别：
1.3 详情标签（了解）
标签名 | 语义和功能 | 属性 | 单标签还是双标签 |
details | 表示一个可以展开或收起的细节或内容 | ㅤ | 双标签 |
summary | 表示 details 中的标题 | ㅤ | 双标签 |
1.4 新增注音标签
标签名 | 语义和功能 | 属性 | 单标签还是双标签 |
ruby | 包裹要注音的文字 | ㅤ | 双标签 |
rt | 写具体的注音 | ㅤ | 双标签 |
1.5 新增文本标签
标签名 | 语义和功能 | 属性 | 单标签还是双标签 |
mark | 用于对某个词语进行标记 | ㅤ | 双标签 |
2 HTML5 表单新增功能
2.1 表单控件新增属性
旧标准存在的表单控件属性：
新标准增加的表单控件属性：
2.2 input 标签的 type 属性新增的值(新增的表单控件类型)
旧标准 input 标签 type 属性的值：
① 输入框类（5个）
② 范围选择框（1个）
③ 颜色选择框（1个）
④ 日期时间选择框类（5个）
2.3 form 标签新增属性
2.4 输入框的搜索提示
3 HTML5 音视频
3.1 音视频标签
标签名 | 功能和语义 | 属性 | 单标签还是双标签 |
video | 视频 | src：视频地址。
width：设置宽度。
height：设置高度。
controls：显示控制条，不需要值。
muted：默认静音，不需要值。
autoplay：自动播放，不需要值。
loop：循环播放，不需要值。
preload：预先加载，不需要值。
poster：设置视频封面图地址。 | 双标签 |
audio | 音频 | src：音频地址。
controls：显示控制条，不需要值。
muted：默认静音，不需要值。
autoplay：自动播放，不需要值。
loop：循环播放，不需要值。
preload：预先加载，不需要值。 | 双标签 |
source | 视频或音频 | src：视频或音频的地址。
type：视频或音频的类型 | 单标签 |
3.2 浏览器支持的音视频格式
① 视频格式
② 音频格式
4 HTML5 新增全局属性
旧标准中的全局属性：
HTML5 标准新增的全局属性
a 标签新增的属性：
5 HTML5 兼容性方案
5.1 设置元信息
5.2 html5shiv.js 让IE8以及以下的浏览器支持H5新标签
6 CSS3 基本语法
6.1 CSS3 浏览器私有前缀
6.2 CSS3 新增长度单位
6.3 CSS3 新增颜色设置方式
① rgba
② hsl
③ hsla
- 作者:昕昕丶未来不是梦
- 链接:https://pisce.buzz/article/web01_h5c3_01
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。