css如何实现固定定位?(代码实例)
程序员文章站
2022-04-15 09:50:07
...
本章用实例给大家介绍css如何实现固定定位,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。
把box2设为固定定位:
<!DOCTYPE html> <html dir="ltr"> <head> <meta charset="utf-8"> <title>定位</title> <style media="screen"> .box1{ width:100px; height: 100px; background-color: rgb(184, 208, 162); } .box2{ width:100px; height: 100px; background-color: rgb(231, 223, 143); position:fixed; left: 100px; top: 100px; } .box3{ width:100px; height: 100px; background-color: rgb(188, 211, 213); } span{ background-color: rgb(209, 198, 209); } </style> </head> <body> <div> <div> </div> <div> <div> </div> </div> <span>span元素</span> </div> </body> </html>
输出:
固定定位永远都会相对于浏览器窗口进行定位;
固定定位会固定在浏览器窗口某个位置,不会随滚动条滚动;
以上就是css如何实现固定定位?(代码实例)的详细内容,更多请关注其它相关文章!