css3新特性

css3新特性

1、圆角边框

border-radius:5px;

2、弹性盒模型

display: flex;

3、媒体查询

@media （max-width: 480px） {.box: {column-count: 1;}}

4、颜色透明度

color: rgba（255, 0, 0, 0.75）；

5、渐变颜色

background:linear-gradient（red, green, blue）；

6、盒子阴影

box-shadow:3px 3px 3px rgba（0, 64, 128, 0.3）；

7、新增选择器

p:nth-child（n）{color: rgba（255, 0, 0, 0.75）}

8、过渡和动画

transition: width 1s linear 2s;

9、盒子的变幻（2D、3D）

  transform: translate(50px,100px);//移动
  transform: rotate();//旋转
  transform: scale();//缩放
  transform: skew();//倾斜

10、文字溢出

 text-overflow:ellipsis;

11、倒影

 box-reflect: below 2px;