网页制作：如何实现把某一个DIV固定在页面的某个地方_安全

使用绝对定位可以事项这个功能，即position： position:absolute; 然后在设置DIV相对与父容器的位置，例如下面这个例子实现将DIV定位在浏览器的左上角 <style type="text/css"> #top { width：400px； height：400px; background-color:#ff0000; position:absolute; left:0px; top:0px; } </style> <body> <div id="top" > </div> </body>

建议使用css实现，效果更佳，使用position: fixed，固定定位，具体位置的调整是用top、left、right、bottom也可以使用margin调整
css实现代码
<div style="position: fixed;top:100px; left: auto; right: auto; bottom: auto; " ></div>
一般的网站的浮动广告以及浮动菜单等可以使用fixed来实现，js的话需要计算位置以及滚动条滚动时触发事件从而进行计算使用windowonscroll事件代码如下
HTML部分代码
<div style="position:absolute;background-color:red;width: 50px;height: 50px;" id="box"></div>
Javascript部分代码
windowonscroll=function(){
var box= documentgetElementById("box");
var t = documentdocumentElementscrollTop || documentbodyscrollTop;
boxstyletop=t+"px";
}

给div加个position:fixed;top:0px;
left:0px;可让该div固定在网页的顶部左侧，且不会随网页而滚动。如若想固定在其他位置，只需要改动top,left,right,bottom属性值即可。

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/yw/10416862.html

网页制作：如何实现把某一个DIV固定在页面的某个地方

发表评论

评论列表（0条）