CSS3
一、css3新特性
css3中新增的特性：选择器，背景和边框属性，文本效果，2D/3D转换
1. 选择器
常规选择器
:last-child / 选择元素最后一个 /
:first-child / 选择元素第一个 /
:nth-child(1) / 选择第几个，写1就是第一个 /
:nth-child(even) / 按照偶数进行选择 /
:nth-child(odd) / 按照奇数进行选择 /
:disabled / 选择每个被禁用的dom元素 /
:checked / 选择每个被选中的dom元素 /
:not(selector) / 选择非 selector 元素的每个元素 /
::selection / 选择被用户选取的元素部分 /
2.背景和边框
背景:
规定背景图片的尺寸:background-size
规定背景图片的定位区域:background-origin（content-box、padding-box、margin-box）
边框:
border-radius: 圆角
border-shadow/text-shadow: 阴影
border-image: 边框图片
3.文本效果
text-justify 规定当 text-align 设置为 “justify” 时所使用的对齐方法
text-emphasis 向元素的文本应用重点标记以及重点标记的前景色
text-outline 规定文本的轮廓
text-overflow 规定当文本溢出包含元素时发生的事情
text-wrap 规定文本的换行规则
word-break 规定非中日韩文本的换行规则
word-wrap 允许对长的不可分割的单词进行分割并换行到下一行
text-decoration 文本修饰符：overline、line-through、underline (上划线、中划线、下划线)
4.2D/3D转换
变形transform：
有rotate旋转、scale缩放、translate位移、skew倾斜
过渡transition：
transition是一个复合属性，可以同时定义transition-property、transition-duration、transition-timing-function、transition-delay子属性值
动画animation
动画的使用，首先通过@（-webkit-)keyframes 定义动画名称及动画的行为，再通过animation属性设置动画特征相关值进行调用
这些新属性大多在新版浏览器得到了支持，有些需要添加浏览器前缀（-webkit-、-moz-、-ms-、-o-）
二、html5新特性
1. 语义化标签：
- 文档头部:header
- 文档尾部:footer
- 文档中的节点:section
- 导航:nav
- 侧边栏:aside
- 独立内容区域:article
2. 对表单增强：
HTML5 拥有多个新的表单 Input 输入类型。这些新特性提供了更好的输入控制和验证
- color 主要用于选取颜色
- date 从一个日期选择器选择一个日期
- datetime 选择一个日期（UTC 时间）
- email 包含 e-mail 地址的输入域
- month 选择一个月份
- number 数值的输入域
- range 一定范围内数字值的输入域
- search 用于搜索域
- tel 定义输入电话号码字段
- time 选择一个时间
- url URL 地址的输入域
3. html5 新增的表单属性
- placehoder 简短的提示在用户输入值前会显示在输入域上。即我们常见的入框默认提示，在用户输入后消失
- required 是一个 boolean 属性。要求填写的输入域不能为空
- pattern 描述了一个正则表达式用于验证 input 元素的值
- min 和 max 设置元素最小值与最大值
- step 为输入域规定合法的数字间隔
- height 和 width 用于 image 类型的 input 标签的图像高度和宽度
- autofocus 是一个 boolean 属性。规定在页面加载时，域自动地获得焦点
- multiple 是一个 boolean 属性。规定 input 元素中可选择多个值
4、html5 新事件
- onresize 当调整窗口大小时触发
- ondrag 当拖动元素时触发
- onscroll 当滚动元素滚动元素的滚动条时触发
- onmousewheel 当转动鼠标滚轮时触发
- onerror 当错误发生时触发
- onplay 当媒介数据将要开始播放时触发
- onpause 当媒介数据暂停时触发