当前位置: 代码迷 >> 综合 >> 固定定位相对于当前父元素
  详细解决方案

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

热度:62   发布时间:2023-10-27 15:46:35.0

我们知道,固定定位是相对于屏幕的。但是,怎么才能实现相对于当前父元素呢?那就是不使用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>

快去试试把~

  相关解决方案