1

我有一个固定对象位于相对定位的父对象中。当您向下滚动页面时,父对象会移动,而固定对象会停留在页面上的特定位置。问题在于,无论相对定位的父对象位于何处,固定对象都是可见的。

有没有办法将固定的物体夹在父母身上?

我一直在寻找解决方法,但找不到。

4

3 回答 3

2

因为固定位置元素相对于视口是固定的,而不是另一个元素。因此,由于视口没有将其切断,溢出变得无关紧要。

于 2013-06-06T14:29:03.550 回答
0

您要问的问题是设计不可能的。尝试使用绝对位置而不是固定位置。看看这张关于定位的表格,从www.w3schools.com复制:

  • 静态 >> 默认。元素按顺序呈现,就像它们出现在文档流中一样 播放 »

  • absolute >> 元素相对于它的第一个定位(非静态)祖先元素定位 播放它 »

  • 固定>>元素相对于浏览器窗口定位播放它»

  • relative >> 元素是相对于它的正常位置定位的,所以 "left:20" 在元素的 LEFT 位置上增加了 20 个像素 播放它 »

  • 继承 >> position 属性的值是从父元素继承的

于 2013-06-06T18:08:42.747 回答
0

我认为你正在寻找的是position: absolute而不是固定的。固定位置始终固定到视口,而绝对定位基于最近定位的祖先。

这是一个显示这种行为的小提琴:http: //jsfiddle.net/8u7aZ/

HTML:

<div id="parent">
    Some text.
    <div id="littleChild"></div>
</div>

CSS:

body {
    height: 1000px;
}

#parent {
    position: relative;
    width: 200px;
    height: 200px;
    border: 1px solid #000;
}

#littleChild {
    position: absolute;
    bottom: 10px;
    right: 10px;
    width: 10px;
    height: 10px;
    background-color: #000;
}

(我只将 body 高度设置为 1000 像素,以便盒子滚动并显示定位。)

于 2013-06-06T18:24:54.700 回答