HTML5-9(CSS3新增特性)

一.RGBA透明度

RGB(红色R+绿色G+蓝色B),RGBA则在其基础上增加了Alpha通道,可用于设置透明值

HTML5-9(CSS3新增特性)_第1张图片
RGBA透明度

二.块阴影与文字阴影

** box-shadow 和 text-shadow **

  • 1.box-shadow : 如果 box-shadow: 0 0 15px green; 代表四边都有阴影


    HTML5-9(CSS3新增特性)_第2张图片
    块阴影

    看下面的列子


    HTML5-9(CSS3新增特性)_第3张图片
    box-shadow
  • 2.text-shadow(文字的阴影)

HTML5-9(CSS3新增特性)_第4张图片
text-shadow(文字的阴影)

三.圆角

border-radius

HTML5-9(CSS3新增特性)_第5张图片
border-radius的使用

四.边框图片 (开发中很少用)

border-image

展示方式: border-image: url(img/3.jpg) 30 30 round;

五.形变(一般用于动画)

transform:none|[]

你可能感兴趣的:(HTML5-9(CSS3新增特性))