美文网首页饥人谷技术博客
通过拆分插件来学习做css立体图

通过拆分插件来学习做css立体图

作者: 秋秋秋web | 来源:发表于2015-11-26 18:30 被阅读74次

1、css写好如下图

程序如下:

2、椭圆造型

#pbtn{ border-radius:200px /100px;}

3、底盘增加阴影效果

#pbtn { box-shadow:0px -15px 15px#88finset, 10px -15px 15px#44finset, -10px -15px 15px#fffinset, -0px 15px#88f, -35px 40px 5pxrgba(0,0,0,0.5);}

4、字体阴影效果

#btnlabel { text-shadow:3px -3px 1px#44f, -3px 3px 1px#fff;}

5、字体倾斜效果

#btnlabel { transform:scale(1,0.5);}

相关文章

网友评论

    本文标题:通过拆分插件来学习做css立体图

    本文链接:https://www.haomeiwen.com/subject/cyddhttx.html