码迷,mamicode.com
首页 > Web开发 > 详细

css3.0

时间:2014-09-14 01:19:16      阅读:298      评论:0      收藏:0      [点我收藏+]

标签:style   color   使用   strong   sp   on   c   ad   ef   

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 表示:阴影特效的大小,该值取值越大,阴影范围越大,但是颜色越浅。

 

css3.0

标签:style   color   使用   strong   sp   on   c   ad   ef   

原文地址:http://www.cnblogs.com/autumn123/p/3970574.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!