在网页中固定层的位置,让层的位置不随着窗口大小而改变的方法
作者:随然 日期: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">
<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">