首页 > Web开发 > 详细

CSS3边框特效

时间:2017-06-25 12:32:25      阅读:298      评论:0      收藏:0      [点我收藏+]

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边框特效

原文:http://www.cnblogs.com/SummerBreezeYHC/p/7076461.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!