可以混合固定/相对定位吗?

问题描述 投票:0回答:1

是否可以有一个相对DIV,其内部有一个固定位置的DIV,该DIV相对于容器是固定的,而不是固定在窗口上的?

我尝试了此答案中显示的解决方案:

固定位置但相对于容器

但似乎都不起作用。这是我正在使用的 HTML/CSS(它是角落里的粉红色 DIV,我希望相对于其容器进行固定):

<html>
<body>

hu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo ho
hu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo ho
hu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo ho
hu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo ho
hu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo ho
hu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo ho
hu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo ho
hu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo ho
hu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo ho
hu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo ho
hu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo hohu hu ohjo ho


<div style="transform: translateZ(0); width: 100%; height: 200px; background-color: #ddd; overflow: auto; padding: 10px; position: relative">
    <div style="position: fixed; top: 20px; right: 20px; background-color: pink; padding: 3px; border: 1px solid gray">Blah!</div>
gygygffgvfvghjgygygffgvfvghjgygygffgvfvghjgygygffgvfvghjgygygffgvfvghjgygygffgvfvghjgygygffgvfvghjgygygffgvfvghjgygygffgvfvghjgygygffgvfvghjgygygffgvfvghjgygygffgvfvghjgygygffgvfvghjgygygffgvfvghjgygygffgvfvghjgygygffgvfvghj
</div>


</body>
</html>
css fixed relative
1个回答
0
投票

position: fixed
将始终与浏览器窗口相关,无论它位于代码中的位置,也无论它是否有一个定位元素作为父元素。

这里你要使用的是

position: absolute
。这将与定位的第一个父级相关(相对、绝对、固定、粘性)。

© www.soinside.com 2019 - 2024. All rights reserved.