如何让一个div不随滚动条的滚动而滚动,即固定在屏幕上...

由于刚接触网页编写

希望大家给一个完整html代码，好让我直接运行，看看效果

希望不要只贴部分代码，而是一个完整可打开的html代码...

先谢谢了..

5 个解决方案

#1

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
  <TITLE> 新的网页 </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
</HEAD>

<BODY>
  新的网页
</BODY>
</HTML>
editplus的默认网页

#2

<HTML>
<HEAD>
<script type="text/javascript">
window.onload = function(){
var dv = document.getElementById("dv1");
window.onscroll = function(){
var _top = window.document.body.scrollTop;
_top += 200;
dv.style.top = _top + "px";
};
};
</script>
</HEAD>

<BODY>
<div id="dv1" style="border:1px solid black;width:180px;height:100px;background:yellow;position:absolute;left:300px;top:200px;">
我是一个不动的DIV
</div>
<div style="height:2000px;"></div>
</BODY>
</HTML>

#3

以下这个绝对能帮到你:

<HTML>
<HEAD>
<STYLE TYPE="text/css">

#div01{  position:absolute;     top:0px;   left:0px;   bottom:0px;   right:0px;   overflow-x:auto;   overflow-y:auto;  }

#div02{  position:absolute;  top:1px;    left:1px;   right:1px;   bottom:1px;   overflow-x:auto;   overflow-y:auto;  }

</STYLE>
</HEAD>

<div id=div01>
<img src=grass_sky.jpg width=100% height=100%>
</div>

<div id=div02>
<center>
<a href=http://www.sysu.edu.cn   title=http://www.sysu.edu.cn target=_blank>SYSU</a>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<a href=http://www.sysu.edu.cn   title=http://www.sysu.edu.cn target=_blank>SYSU</a>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<a href=http://www.sysu.edu.cn   title=http://www.sysu.edu.cn target=_blank>SYSU</a>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</center>
</div>

</HTML>

#4

真是太感谢了...

引用 3 楼 fififisher 的回复:

以下这个绝对能帮到你:

<HTML>
<HEAD>
<STYLE TYPE="text/css">

#div01{ position:absolute; top:0px; left:0px; bottom:0px; right:0px; overflow-x:auto; overflow-y:auto; }

#div02{ position:absolute; top:1px……

#5

对了,3楼的代码直接可以用在firefox里

但是如果要在ie里正常,要在代码的最前加上一行内容:

<!DOCTYPE ....>

#1

#2

#3

#4