css3.0

css3.0相比css2.0多了些我们经常需要使用的标签属性，例如：圆角，个别圆角，不透明度，阴影特效等

1、圆角（即如何画圆）border-radius

a{width:20px;

height:20px;

background:red;

border-radius:20px;}

注：其实就是定义一个矩形，将圆的 半径和矩形的宽定义为同一个值，即得出圆。

2、个别圆角（对矩形倒圆角）border-radius

个别圆角：指对矩形的四个角定义圆角，可一次性定义四个角

a{width:20px;

height:20px;

background:red;

border-radius:5px;}

或者定义单个方向上的圆角：

a{width:20px;

height:20px;

background:red;

border-top-left-radius:5px;  (定义矩形左上角圆角)

border-top-right-radius:5px; (定义矩形右上角圆角)

border-bottom-left-radius:5px; (定义矩形左下角圆角)

border-bottom-right-radius:5px; (定义矩形右上角圆角)

}

注意：：定义个别圆角时候，顺序是先上下，在左右。

3、不透明度  opacity

一个简单的语句就能实现

a {background:red;

opacity:0.3;}

注：opacity 取值为0-1。  0表示完全透明，1表示完全不透明。

 

4、阴影特效 shadow

a {background:red;

border:1px solid blue;

shadow:3px 5px 4px red;}

shadow 后面的3个取值表示的意思：

3px  表示：阴影特效在X轴上的距离；

5px 表示：阴影特效在Y轴上的距离；

4px 表示：阴影特效的大小，该值取值越大，阴影范围越大，但是颜色越浅。