css div 固定一个div 使这个div不随着网页的滚而滚动 就是把这个div固 ...
发布网友
发布时间：2022-05-02 19:07
共9个回答
热心网友
时间：2022-05-11 07:24
1、需要使用固定定位才能做到这样的效果。具体方法是首先打开html编辑器，首先设置一个容器div，然后设置一个用来演示效果的div，分别设置class属性名为container和fixed：
2、在style标签中设置样式，设置container的position属性为相对定位，并且给它一个很高的高度，然后给fixed设置高度和宽度，以及颜色等属性，这里的重点是设置position属性为fixed，以及设置top和left属性控制div的位置，设置完成后保存文件：
3、打开浏览器，可以看到div并且可以观察到进度条是最上面的：
4、接着将进度条拉倒最下面，可以发现div还是在原来的位置保持不变。以上就是用fixed属性设置div固定位置的方法：
热心网友
时间：2022-05-11 08:42
.a{
width:100px;
height:40px;
background-color:#0CF;
position:fixed;
top:100px;
}
.b{
width:400px;
height:3000px;
background-color:#CC0;
}
</style>
<body>
<div class="a">菜单</div>
<div class="b">子菜单<br>子菜单<br>子菜单<br>子菜单<br>子菜单<br>子菜单<br>子菜单</div>
热心网友
时间：2022-05-11 10:17
热心网友
时间：2022-05-11 12:08
//绝对定位和相对定位
position: absolute;
z-index: 100;
left: 100px;
top: 100px;
--------------------
position: relative;父元素
position: absolute;子元素
热心网友
时间：2022-05-11 14:16
<div style="width:50px; height:50px; background:blue;top:80px; position:fixed; ">不动</div>
热心网友
时间：2022-05-11 16:41
<div style="width:50px; height:50px; background:blue;top:80px; position:fixed; ">我不动</div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
热心网友
时间：2022-05-11 19:22
1、position：absolute 绝对定位
生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。
元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
2、position：fixed 固定定位
生成绝对定位的元素，相对于浏览器窗口进行定位。
元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
3、position：relative 相对定位
生成相对定位的元素，相对于其正常位置进行定位。
因此，"left:20" 会向元素的 LEFT 位置添加 20 像素。
根据你讲的，使用position：fixed固定定位
热心网友
时间：2022-05-11 22:20
