求一个能用在淘宝上的效果，当鼠标移动到图片上时，显示一个方框。 120
我在别的网站上找过，有这种效果的源码，但我看不懂，复制到淘宝上用不了，要求给个能用在淘宝上的。。。...
我在别的网站上找过，有这种效果的源码，但我看不懂，复制到淘宝上用不了，要求给个能用在淘宝上的。。。
展开
2个回答
展开全部
用一下代码，图片地址自己改
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
body {
font-size:12px;
font-family:Verdana;
line-height:1.5;
width: 522px;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
}
#layout ul li {
text-align: center;
width: 80px;
margin-top: 20px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 20px;
float: right;
}
#layout ul li a {
display: block;
}
#layout ul li a img {
padding: 1px;
margin-bottom: 3px;
border: 1px solid #000;
}
#layout ul li a:hover img {
padding: 0px;
border: 2px solid #F00;
}
ul,dl,dt,dd,h1,h2,h3,h4,h5,h6,form { padding:0; margin:0;}
ul { list-style:none;}
img { border:0px;}
a { color:#05a; text-decoration:none;}
a:hover { color:#f00;}
</style>
</head>
<body>
<div id="layout">
<ul><li><a href="#"><img src="images/001.jpg" width="80" height="80" />dfdfg</a></li><li><a href="#"><img src="images/002.jpg" width="80" height="80" />gfhfgh</a></li><li><a href="#"><img src="images/003.jpg" width="80" height="80" />fhdf</a></li><li><a href="#"><img src="images/004.jpg" width="80" height="80" />dfdg</a></li><li><a href="#"><img src="images/005.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/006.jpg" width="80" height="80" />sdfsf</a></li><li><a href="#"><img src="images/007.jpg" width="80" height="80" />sdfsf</a></li><li><a href="#"><img src="images/008.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/009.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/010.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/011.jpg" width="80" height="80" />sdsf/a></li><li><a href="#"><img src="images/012.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/011.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/012.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/011.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/012.jpg" width="80" height="80" />sdsf</a></li>
</ul>
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
body {
font-size:12px;
font-family:Verdana;
line-height:1.5;
width: 522px;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
}
#layout ul li {
text-align: center;
width: 80px;
margin-top: 20px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 20px;
float: right;
}
#layout ul li a {
display: block;
}
#layout ul li a img {
padding: 1px;
margin-bottom: 3px;
border: 1px solid #000;
}
#layout ul li a:hover img {
padding: 0px;
border: 2px solid #F00;
}
ul,dl,dt,dd,h1,h2,h3,h4,h5,h6,form { padding:0; margin:0;}
ul { list-style:none;}
img { border:0px;}
a { color:#05a; text-decoration:none;}
a:hover { color:#f00;}
</style>
</head>
<body>
<div id="layout">
<ul><li><a href="#"><img src="images/001.jpg" width="80" height="80" />dfdfg</a></li><li><a href="#"><img src="images/002.jpg" width="80" height="80" />gfhfgh</a></li><li><a href="#"><img src="images/003.jpg" width="80" height="80" />fhdf</a></li><li><a href="#"><img src="images/004.jpg" width="80" height="80" />dfdg</a></li><li><a href="#"><img src="images/005.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/006.jpg" width="80" height="80" />sdfsf</a></li><li><a href="#"><img src="images/007.jpg" width="80" height="80" />sdfsf</a></li><li><a href="#"><img src="images/008.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/009.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/010.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/011.jpg" width="80" height="80" />sdsf/a></li><li><a href="#"><img src="images/012.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/011.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/012.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/011.jpg" width="80" height="80" />sdsf</a></li><li><a href="#"><img src="images/012.jpg" width="80" height="80" />sdsf</a></li>
</ul>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
易扑源码有这个网页特效，你可以去看看
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
