首页 > 代码库 > CSS3边框特效

CSS3边框特效

1.边框阴影:box-shadow:30px 10px 10px 10px black;

(1)水平方向的阴影,负值向左偏移。

(2)垂直方向阴影,负值向上偏移。

(3)代表阴影模糊度,最小为0,模糊代表越往外侧颜色越浅。

(4)阴影的外延值,代表阴影所占据的范围。

(5)阴影的颜色,可以省略,默认为黑色。

box-shadow:30px 10px 10px;(三个值,阴影的外延值就不存在了)。

box-shadow:30px 10px;(两个值,阴影的模糊度和外延值就不存在了)。

insert代表阴影出现在元素的内部,大于0出现在左和上,小于0出现在右和下。

box-shadow:insert 10px -10px;

2.圆角

border-radius:10px 30px;(代表左上,右下)

border-radius:10px 30px 50px;(代表右上,右下,左下)

border-radius:10px 30px 50px 70px(按顺时针显示左上,右上,右下,左下)

border-radius:100px(水平)/50px(垂直)     (水平的椭圆)

 

CSS3边框特效