纯CSS实现鼠标移上图片添加阴影效果



CSS给图片添加阴影 - 锐客网

*{padding:0; margin:0; }
body{background:#E8EDF1; padding:20px; }
#profileAvatar {overflow:hidden; zoom:1; }
#profileAvatar i{float:left; visibility:hidden; background:url(/jscss/demoimg/200912/avatar.gif) 0 0 no-repeat; }
#profileAvatar i i{background-position:100% 0; }
#profileAvatar i i i{background-position:0 100%; }
#profileAvatar i i i i{padding:0 5px 6px 0; background-position:100% 100%; }
#profileAvatarimg{visibility:visible; display:block; padding:3px; border:1px solid #ccc; background:#fff; }





纯CSS实现鼠标移上图片添加阴影效果
文章图片



鼠标移上去显示圆滑的阴影







    推荐阅读