【原】Div+Css控制div定位

小傅哥 2021-12-13

展開全文

ie版本Div不隨著滾動(dòng).html

?-----------------------------------------------------

<html>
<head>
<title></title>
<style type="text/css">
html,body {
overflow:hidden;
margin:0px;
width:100%;
height:100%;
}
.virtual_body {
width:100%;
height:100%;
overflow-y:scroll;
overflow-x:auto;
}
.fixed_div {
position:absolute;
z-index:2008;
bottom:20px;
left:40px;
width:800px;
height:40px;
border:1px solid red;
background:#e5e5e5;
}
</style>
</head>
<body>
<div class="fixed_div">I am still here!</div>
<div class="virtual_body">
<div style="height:888px;">
I am content !
發(fā)動(dòng)機(jī)啊刻錄機(jī) 房?jī)r(jià)的薩拉看放大
房?jī)r(jià)的薩拉

發(fā)動(dòng)機(jī)啊刻錄機(jī) 房?jī)r(jià)的薩拉看放大
房?jī)r(jià)的薩拉

發(fā)動(dòng)機(jī)啊刻錄機(jī) 房?jī)r(jià)的薩拉看放大
房?jī)r(jià)的薩拉
</div>
</div>

</body>
</html>

非ie版本Div不隨著滾動(dòng).html

--------------------------

<html>?
<head>?
??? <title></title>?
??? <style type="text/css">??
????? html,body {?
??????????? overflow:hidden;?
??????????? margin:0px;?
??????????? width:100%;?
??????????? height:100%;?
?????? }?
?
?????? .virtual_body {?
??????????? width:100%;?
???????????? height:100%;?
??????????? overflow-y:scroll;?
??????????? overflow-x:auto;?
??????? }?
?
??????? .fixed_div {?
??????????? position:absolute;?
??????????? z-index:2008;?
??????????? bottom:20px;?
??????????? left:40px;?
??????????? width:800px;?
??????????? height:40px;?
??????????? border:1px solid red;?
??????????? background:#e5e5e5;?
??????? }?
??? </style>?
</head>?
?
<body>?
<div class="fixed_div">I am still here!</div>?
<div class="virtual_body">?
??? <div style="height:1800px;">?
??????? I am content !?
??? </div>?
</div>?