CSS3

新增选择器

 

一、属性选择器：

   

二、伪类选择器

三、UI伪类选择器

常用操作

1.boreder-radius : 为元素添加圆角边框

2.border-image : 为元素添加边框背景

3.box-shadow :

background-origin ：用来定义背景图像的定位区域（背景图像是从content开始还是padding还是border开始）

background-clip : 用来定义背景图像的裁剪区域

background-size : 用来定义背景图像的大小

 

常用文本属性

text-shadow : 定义文本阴影或模糊效果

text-overflow : 用来定义省略文本的处理方式

word-wrap :

@font-face规则：

RGBA

HSLA:作用色调（H）、饱和度（S）和亮度（L）3个要素基础上增加了不透明度（A）参数。

 

2D变形

transform : 对一些元素实现一些变形功能。

实例：

div { transform: translate(50px,100px);

-ms-transform: translate(50px,100px); /* IE 9 */

-webkit-transform: translate(50px,100px); /* Safari and Chrome */

}

transform-origin :

动画设计

transition :

 

animations动画：

第一步：定义@keyframes规则

第二步：把@keyframes规则捆绑到具体需要的元素中 用animation+@keyframes 名字

@keyframes规则：@keyframes规则是创建动画。 @keyframes规则内指定一个CSS样式和动画将逐步从目前的样式更改为新的样式。