css3如何实现浮雕效果

说到浮雕效果，马上就会想到photoshop；但是对于一个响应式网页来说，一张图片放在不同媒体上会出现变形、影响整个页面的布局等；css3新增属性字体阴影（text-shadow）可以轻松实现浮雕效果，在这里详解如何通过css3来实现浮雕效果

2、首先来个字体阴影例子：css部分：h1{ font-size: 100px; margin:50px auto; text-align: center; text-shadow:10px 10px 8px rgba(0,180,255,1); }html部分：<h1>文字阴影效果</h1>效果如图：

4、如果将水平偏移量和垂直偏移量设置相同的撕良滤儆值，就可以构建出凸起的浮雕效果。例子：css部分：h3{ font-size: 100px; color: #fff; margin-top: 30px; text-align: center;text-shadow:2px 2px 4px #000;//水平偏移量和垂直偏移量设置相同的值}html部分：<h3>浮雕效果1</h3>效果如图：