在网页中固定层的位置，让层的位置不随着窗口大小而改变的方法
作者:随然 日期:2010-08-24
层的位置有相对位置和绝对位置，比如说居中，就是相对位置，离左边100px 这就是绝对位置。
做网页菜单的时候，一般网页都使相对居中的，也就是无论窗口多大，网页都是居中的。所以，如果把菜单的位置设置为绝对位置(比如距离左边多少距离顶部多少) ，这样如果窗口大小改变，菜单的位置就随之改变。当然，这肯定不是你想要的效果。
第一种办法是将层做在表格中。这种办法也可以实现，层标签外面套表格。具体就不说了。
第二种办法就是两个层嵌套。由于网页是居中的，也就是相对居中，所以外层就可以使用相对位置居中，里面的层就是用绝对位置。
举个例子：
复制内容到剪贴板
程序代码
程序代码<div align="center" style="position: relative; z-index: 1; width:950px;"; id="layer105">
<DIV id=Layer5 onmouseover="MM_showHideLayers('Layer5','','show');" onmouseout="MM_showHideLayers('Layer5','','hide')" style="Z-INDEX: 105; POSITION: absolute; LEFT: 660px; TOP: 0px; visibility: hidden; " class="index_dh">
<table width="210" border="0" cellspacing="0" cellpadding="0" >
<tr height="31">
<td width="2" background="images_shouye/dh_di_left.gif"></td>
<td background="images_shouye/dh_di_zhong.gif">
<table width="200" height="30" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center"><a href="http://www.suiran.cn/" target="_blank">随然日记本</a></td>
<td align="center"><a href="http://www.blueidc.cn/" target="_blank">蓝点科技</a></td>
</tr>
</table>
</td>
<td width="2" background="images_shouye/dh_di_right.gif"></td>
</tr>
</table>
</DIV>
</div>
<DIV id=Layer5 onmouseover="MM_showHideLayers('Layer5','','show');" onmouseout="MM_showHideLayers('Layer5','','hide')" style="Z-INDEX: 105; POSITION: absolute; LEFT: 660px; TOP: 0px; visibility: hidden; " class="index_dh">
<table width="210" border="0" cellspacing="0" cellpadding="0" >
<tr height="31">
<td width="2" background="images_shouye/dh_di_left.gif"></td>
<td background="images_shouye/dh_di_zhong.gif">
<table width="200" height="30" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center"><a href="http://www.suiran.cn/" target="_blank">随然日记本</a></td>
<td align="center"><a href="http://www.blueidc.cn/" target="_blank">蓝点科技</a></td>
</tr>
</table>
</td>
<td width="2" background="images_shouye/dh_di_right.gif"></td>
</tr>
</table>
</DIV>
</div>
上一篇: Windows XP SP3本地磁盘右键没有“共享和安全”选项，无法设置权限的解决办法
下一篇: 人生有三种境界
文章来自: 本站原创
引用通告: 查看所有引用 | 我要引用此文章
Tags: 网页 层 
相关日志:
评论: 0 | 引用: 0 | 查看次数: 13640
发表评论
