1 HTML5新特性
主要是增加新的标签、 新的表单和新的表单属性等，但是基本是 IE9+ 以上版本的浏览器才支持
1.1 HTML5新增语义化标签
<header>：头部标签
<nav>：导航标签
<article>：内容标签
<section>： 定义文档某个区域
<aside>：侧边栏标签
<footer>：尾部标签
注意：
1.这种语义化标准主要是针对搜索引擎的
2. 这些新标签页面中可以使用多次
3. 在 IE9 中， 需要把这些元素转换为块级元素
1.2 HTML5新增多媒体标签
1. 视频： <video>
支持的格式：
语法：<video src="文件地址" controls="controls"></video>
或者
<video controls="controls" width="300">
<source src="move.ogg" type="video/ogg" >
<source src="move.mp4" type="video/mp4" >
您的浏览器暂不支持 <video> 标签播放视频
</ video >
常见属性：
2. 音频： <audio>
支持格式：
语法：<audio src="文件地址" controls="controls"></audio>
或者
< audio controls="controls" >
<source src="happy.mp3" type="audio/mpeg" >
<source src="happy.ogg" type="audio/ogg" >
您的浏览器暂不支持 <audio> 标签。
</ audio>
常见属性：
注意：谷歌浏览器把音频和视频自动播放禁止了
总结：
1.音频标签和视频标签使用方式基本一致
2.浏览器支持情况不同
3.谷歌浏览器把音频和视频自动播放禁止了
4.我们可以给视频标签添加 muted 属性来静音播放视频，音频不可以（可以通过JavaScript解决）
5.视频标签是重点，我们经常设置自动播放，不使用 controls 控件，循环和设置大小属性
1.3 HTML5新增input类型
常用表单：
重点记忆：number tel search
1.4 HTML5新增表单属性
可以通过以下设置方式修改placeholder里面的字体颜色：
input::placeholder {
color: pink;
}2 CSS3新特性
2.1 CSS3新增选择器
1.属性选择器
属性选择器可以根据元素特定属性的来选择元素。 这样就可以不用借助于类或者id选择器。
注意：
1.类选择器和属性选择器 伪类选择器 权重都是 10
2.属性选择器选择属性=值的某些元素 重点务必掌握的
2.2 结构伪类选择器
结构伪类选择器主要根据文档结构来选择器元素， 常用于根据父级选择器里面的子元素
重点：nth-child（ n） 选择某个父元素的一个或多个特定的子元素
n可以是：
1.数字，关键字和公式
2.关键字： even 偶数， odd 奇数
3.公式：常见的公式如下 ( 如果n是公式，则从0开始计算，但是第 0 个元素或者超出了元素的个数会被忽略 )
区别：
1. nth-child 对父元素里面所有孩子排序选择（序号是固定的） 先找到第n个孩子，然后看看是否和E匹配
2. nth-of-type 对父元素里面指定子元素进行排序选择。 先去匹配E ，然后再根据E 找第n个孩子
小结：
1.结构伪类选择器一般用于选择父级里面的第几个孩子
2. nth-child 对父元素里面所有孩子排序选择（序号是固定的） 先找到第n个孩子，然后看看是否和E匹配
3. nth-of-type 对父元素里面指定子元素进行排序选择。 先去匹配E ，然后再根据E 找第n个孩子
4.关于 nth-child（ n） 我们要知道 n 是从 0 开始计算的，要记住常用的公式
5. 如果是无序列表，我们肯定用 nth-child 更多
6.类选择器、属性选择器、伪类选择器，权重为 10。
2.3 伪元素选择器
重点：
1.before 和 after 创建一个元素，但是属于行内元素
2. 新创建的这个元素在文档树中是找不到的，所以我们称为伪元素
3.语法： element::before {}
4. before 和 after 必须有 content 属性
5. before 在父元素内容的前面创建元素， after 在父元素内容的后面插入元素
6. 伪元素选择器和标签选择器一样，权重为 1
div::before {
content: '我';
width: 30px;
height: 40px;
background-color: purple;
}
