|
***************************************
二，用JS使层居中
把如下代码加入<body>区域中
<DIV id=L1 style="HEIGHT: 107px; LEFT: 341px; POSITION: absolute; TOP: 585px; WIDTH: 205px; Z-INDEX: 1">
<TABLE bgColor=#ffffff border=1 borderColorDark=#ffffff borderColorLight=#000000 cellPadding=0 cellSpacing=0 width="100%">
<TR>
<TD height=1 width=178>网页教学网</TD>
<TD align=middle onclick="L1.style.visibility='hidden'"
style="CURSOR: hand" width=21>х</TD></TR>
<TR vAlign=top>
<TD colSpan=2
height=91>欢迎光临本站!<BR><BR>本站域名:<BR><a href="http://www.wd1x.com" target="_blank">http://www.wd1x.com</a>
</TD></TR></TABLE></DIV>
<SCRIPT LANGUAGE="JavaScript">
function moveit() //这个函数用于把层放到浏览器中间
{
L1.style.left=((document.body.offsetWidth-parseFloat (L1.style.width))/2) document.body.scrollLeft;
L1.style.top=((document.body.offsetHeight-parseFloat (L1.style.height))/2) document.body.scrollTop;
}
window.onload=moveit; //网面打开时时执行moveit()
window.onresize=moveit; //当调整浏览器大小时执行moveit()
window.onscroll=moveit; //当拉动滚动条时执行moveit()
</SCRIPT>
三，用定位方法居中
<div style="background:#f00; width:740px; height:340px; left:50%; margin:0px 0 0 -370px; position:absolute;">
解释：这个方法以前只是知道，但一次一个朋友问我方法的原理，那时我没有答上来，前几天看了一文章后才突然明白了它的原理！以前我的理解是先左边界-370px,然后是想position问题，所以始终想不通。其实我们可以反过一想先定位后边界，这样就很容易理解了。position:absolute;它是对浏览器定位的，left:50%;正好在中间的位置上，也就是这个DIV块左边界上处于游览器的中间位置，在加入样式margin-left:-370px,这个370是算出来的，它恰好是div740的一半，我们让DIV往回走370，这样DIV的中线与浏览器的中线重合所以看到的DIV总是在中间的！这个方法也有一个缺点就是如是你的浏览器小于WIDTH的话，对你来说要不是一件另人愉快的事！
|
