CSS 边框 阴影 效果

大家好，又见面了，我是全栈君。

CSS 边框 阴影 效果

以下将css实现阴影效果，以便须要朋友们，直接上代码

#shadow1{ width: 200px; height: 100px; color: white; background-color: red; box-shadow: 5px -5px 1px 1px #000; -webkit-box-shadow:5px -5px 1px 1px #000; -moz-box-shadow:5px 5px 1px 1px #000; /* For IE 8 */ -ms-filter: progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=120, Color=’#1000′); /* For IE 5.5 – 7 */ filter: progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=125, Color=’#1000′); }

CSS 边框 阴影 效果

#shadow2{ width: 420px; height: 650px; background: url(1.jpg) no-repeat; margin-top: 20px; box-shadow: 10px 8px 10px 3px #000; /*Chrome 6+, Firefox 4+, IE 9+, iOS 5+, Opera 10.50+*/ -webkit-box-shadow: 10px 8px 10px 3px #000; -moz-box-shadow: 10px 8px 10px 3px #000; /*background-clip: padding-box;*/ opacity: 0.9; /*透明度*/ }

CSS 边框 阴影 效果

阴影的样例就到这里，文章简陋。不足之处还请大神多多指正。谢谢…

发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/115561.html原文链接：https://javaforall.cn