15621857753

使用CSS3制作的比较好看的阴影效果

来源:齐鲁建站 栏目:建站资讯 阅读: 日期:2021-04-01

本文介绍了使用CSS3制作的比较好看的阴影效果,阴影效果有时候是非常棒的存在,用的巧妙可以起到非常好的效果。本教程的CSS是齐鲁建站小编精心调制的,效果那是相当的棒。推荐给有所需要的朋友,试试看吧。

响应式网站建设

最近改个手机端的页面效果,点击出现二级下拉菜单,都是白色界面,二者视觉上会融合在一起,想个办法区分一下。

要是用不同的颜色吧,感觉好像会很突兀,怎么弄呢,突然想到,使用阴影效果,这样颜色上接受,还能有所区分。

我真是个天才!

经过齐鲁建站小编的屡次调试,最决个人认为调到了最完美的境界,以防下次还会使用,于是记录于此,感兴趣的也可以直接拿去用。

先来个效果图:

CSS3阴影效果

CSS3效果如下:

box-shadow:0px 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
webkit-box-shadow:0px 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
moz-box-shadow:0px 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
o-box-shadow:0px 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;

放到CSS文件直接使用就可以了。

以上就是关于的所有内容,希望可以帮到大家,欢迎找小编一起交流~

展开