纯CSS实现的当鼠标移上图片添加阴影效果代码_软件编程

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

发布时间：2026-01-11

点击量：

<html> <head> <title>CSS给图片添加阴影</title> <style> *{padding:0;margin:0;} body{background:#E8EDF1;padding:20px;} #profileAvatar {overflow:hidden;zoom:1;} #profileAvatar i{float:left;visibility:hidden;background:url(//img.jbzj.com/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%; } #profileAvatar img{visibility:visible;display:block;padding:3px;border:1px solid #ccc;background:#fff;} </style> <script type="text/javascript" src="/public/static/common/js/ey_global.js?v=v1.7.1"></script>
</head> <body>                      <i><i><i><i>      </i></i></i></i>  鼠标移上去显示圆滑的阴影   <input type="button" value="缩小图片" onclick="document.getElementById('image').width -=10;" /> <script type="text/javascript">var root_dir="";var ey_aid=470740;</script>
<script language="javascript" type="text/javascript" src="/public/static/common/js/ey_footer.js?v=v1.7.1"></script>
</body> <script type="text/javascript">     var imgBg=document.getElementById('profileAvatar').getElementsByTagName('i')     function show(){         for(i=0;i </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

上一篇：Div+Js实现的带阴影菜单微软以前网站曾用过

下一篇：JavaScript 未知高度元素垂直居中实现代码

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

发布时间：2026-01-11

点击量：

返回

4008888355