如果你想在
HTML 页面上滚动时让某个 `
div` 的
位置悬浮不变，可以使用
CSS 中的 `position: fixed;` 属性来实现。这个属性会让元素的
位置相对于浏览器窗口
固定不变，而不是相对于文档流的
位置。
下面是一个示例代码，展示如何使用 `position: fixed;` 来让一个 `
div` 的
位置悬浮不变：
```
html
<!DOCTYPE
html>
<
html>
<head>
<style>
#fixed-
div {
position: fixed;
top: 10px;
right: 10px;
width: 200px;
height: 100px;
background-color: lightblue;
}
</style>
</head>
<body>
<
div id="fixed-
div">
这个
div 的
位置会在
页面滚动时悬浮不变。
</
div>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ut nunc rhoncus, viverra mauris eu, cursus ipsum. Nam eu sodales mauris. Maecenas at sodales ipsum. Sed ut eros vel diam consequat commodo. Ut elit velit, congue eget orci nec, pharetra hendrerit elit. Ut bibendum convallis nisi, sit amet finibus ex bibendum a. Nulla facilisi. Aenean euismod enim vel risus imperdiet euismod. Curabitur euismod tincidunt neque, nec elementum lorem.
</p>
<p>
Mauris eget massa enim. Nullam at tellus vel ex sagittis suscipit. Sed nec tellus eu quam lobortis dignissim. Morbi eget diam id felis semper semper. Nunc pulvinar, nunc quis interdum suscipit, nisl quam accumsan enim, ut viverra magna libero in sapien. Fusce aliquam vestibulum orci, id tempor lorem viverra eu. Proin interdum, mauris vitae faucibus malesuada, augue nibh feugiat tellus, sed varius purus arcu vel turpis. Sed eget ante quis felis lacinia commodo.
</p>
<p>
Integer et magna at orci bibendum efficitur. Suspendisse iaculis congue justo, vel rutrum enim fringilla eu. Fusce pellentesque euismod lorem, eu scelerisque purus malesuada vel. Sed sit amet nisi dignissim, lacinia mauris nec, varius elit. Nulla facilisi. Etiam maximus, velit vel rhoncus consequat, ex arcu imperdiet arcu, eu bibendum nulla metus vel orci. Maecenas bibendum, mauris eget rutrum egestas, mi odio tempus nisi, ac viverra purus sem id velit.
</p>
</body>
</
html>
```
在上面的代码中，我们创建了一个 `
div` 元素，并把它的 `position` 属性设置为 `fixed`，这样它的
位置就会
固定在浏览器窗口的右上角。在这个例子中，我们还设置了 `top` 和 `right` 属性来调整 `
div` 元素的
位置。
667
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
