admin avatar

纯CSS实现网站图片圆角和阴影效果

🕕 by admin

纯CSS实现网站图片圆角和阴影效果

1
box-shadow: 10px 10px 10px rgba(0,0,0,.5);-moz-box-shadow: 10px 10px 10px rgba(0,0,0,.5);-webkit-box-shadow: 10px 10px 10px rgba(0,0,0,.5);border-radius:5%

注意上下层关系,可以单独写一个CSS声明

比如只需要文章图片实现阴影和圆角效果

1
.content  img {box-shadow: 10px 10px 10px rgba(0,0,0,.5);border-radius:5%;}

基本上主流的新版桌面和手机浏览器都支持图片圆角和阴影,上图测试,效果如下

💘 相关文章

写一条评论