用dw做鼠标经过图像放大，如何固定图像位置，图像放大时排版就错位 15
<html><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><title>无...
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
#apDiv1 {
position:absolute;
left:0;
top:0;
width:760px;
height:380px;
z-index:1;
overflow: hidden;
}
#apDiv2 {
position:absolute;
left:36px;
top:14px;
width:190px;
height:190px;
z-index:1;
}
</style>
</head>
<body>
<table width="760" border="0" align="center" cellspacing="0">
<tr height="190">
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
</tr>
<tr height="190">
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
</tr>
</table>
</body>
</html> 展开
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
#apDiv1 {
position:absolute;
left:0;
top:0;
width:760px;
height:380px;
z-index:1;
overflow: hidden;
}
#apDiv2 {
position:absolute;
left:36px;
top:14px;
width:190px;
height:190px;
z-index:1;
}
</style>
</head>
<body>
<table width="760" border="0" align="center" cellspacing="0">
<tr height="190">
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
</tr>
<tr height="190">
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
<td width="190"><img src="图片链接" alt="" name="a" width="190" height="190" border="0" id="a" style="margin: 0px; float: none;" onmouseover="width=300,height=300" onmouseout="width=190,height=190"></td>
</tr>
</table>
</body>
</html> 展开
2个回答
展开全部
原本你的图片是在整个文档流当中的，当你改变它的尺寸时，就会影响到整个文档流中其他元素的布局，要避免这种情况，可以在改变它的尺寸的同时，用position和z-index让它脱离原本的文档流
本回答由网友推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
锁定
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
