H5C3新特性

兼容性：支持ie9以上

1.H5 新增标签

nav(定义导航链接部分)  header（定义文档的头部）  footer（定义文档的页脚底部） article（定义文章） section（定义文档的节，相当于div）aside（定义其所处之外的内容，边）

手机移动端不需要考虑兼容性的问题，经常用到

2.新增属性 datalist 与input 搭配，下拉搜索框。

3.新增表单

• color,选择颜色
• date 选择日期
• email 用于检测输入的是否为email格式的地址
• month 选择月份
• number 用于应该包含数值的输入域，可以设定对输入值的限定
• range 用于定义一个滑动条，表示范围
• search 用于搜索，比如站点搜索或 Google 搜索
• tel 输入电话号码
  -time 选择时间
• url 输入网址
• week 选择周和年

4. css3 伪类选择器  ：t

tag:first-child  选择其父元素的第一个子元素是tag的元素

tag:last-child  选择其父元素的最后一个子元素是tag的元素

tag:nth-child(n)  选择其父元素的第n个子元素是tag的元素 n=1,2,3... 

tag:nth-child(even)  选择其父元素的第偶数子元素是tag的元素

tag:nth-child(odd)  选择其父元素的第奇数子元素是tag的元素

eg :   a:hover{

}  鼠标经过链接时。。

结构：选择器

li:first-child{

}

属性选择器

div[class="demo"]  选出div 下属性class 为 demo 的元素。

div[class^=test]  选出div 下属性class 以test开头 的元素。

div[class$=test]  选出div 下属性class 以test结尾 的元素。

伪元素选择器。

p::first-letter  段落第一个字母

p::first-line 段落第一行

p::selection 选中文字状态

before  after 伪元素

div::before   在div 内容前 插入 before   行内盒子，伪元素。 

div::after     在div 内容后 插入 before   行内盒子，伪元素。 

5. css3盒子模型

box-sizing:

content-box (盒模型宽度=width+padding+border)   border-size(盒模型宽度=width  padding+border包含在width)

tranform:scale(1.1)  变换图像等扩大1.1倍。tranform  :rotate(ndeg)  旋转n度；transform-origin: right bottom (以右下角为旋转中心） 

过渡：

transition: 属性  耗时s （1s）  变化方式（ease linear等）何时开始（0s）