欢迎访问 生活随笔!

生活随笔

当前位置: 首页 > 编程资源 > 编程问答 >内容正文

编程问答

固定定位相对于当前父元素

发布时间:2024/1/8 编程问答 46 豆豆
生活随笔 收集整理的这篇文章主要介绍了 固定定位相对于当前父元素 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

我们知道,固定定位是相对于屏幕的。但是,怎么才能实现相对于当前父元素呢?那就是不使用top left bottom right。而是使用margin-top margin-left margin-bottom margin-right

直接上代码,测试一下,你会恍然大悟!

<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>test</title><style>.father{top:100px;position: absolute;display: block;width: 200px;height: 200px;background: red;}.sun{position: fixed;margin-left: 100px;display: block;width: 100px;height: 100px;background:blue;}</style> </head> <body><div class="father"><div class="sun"></div></div> </body> </html>

快去试试把~

总结

以上是生活随笔为你收集整理的固定定位相对于当前父元素的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错,欢迎将生活随笔推荐给好友。