css – 父母的位置是绝对的,孩子的位置是相对的,反之亦然

前端之家收集整理的这篇文章主要介绍了css – 父母的位置是绝对的,孩子的位置是相对的,反之亦然前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有另外div的div.好的,我得到的情况是父母的位置:亲戚和
孩子是位置:绝对的.我不知道什么时候会发生什么

>父母的位置是绝对的,孩子的位置是相对的
>父母的位置是绝对的,孩子的位置是绝对的
>父母的位置是相对的,孩子的位置是相对的

我使用Why does an absolute position element wrap based on its parent’s right bound?JSbin示例,但问题一般适用于定位概念

解决方法

Read more about absolute,relative,and fixed position and how they differ here,但我会尝试专门回答你关于关系的问题.

position:absolute将该元素定位到其最近的父级,其位置不是静态的.静态是一切的默认值.

位置:亲戚有点奇怪,因为它确实影响了元素的孩子,而不是它自己的位置.它只是对它的子元素说,“如果你有位置,那就把自己定位于我:绝对.”固定或绝对的位置做同样的事情(意味着其定位的孩子将相对于其边界定位),但这些样式也会影响他们在页面上的位置.具有位置:相对的元素看起来不会有任何不同,但它可能是儿童.

所以考虑这样的情况:

<div class="parent">
     <div class="child">
           <div class="grandchild"></div>
     </div>
</div>

如果孙子有位置:绝对,它将相对于浏览器窗口定位自己,因为没有父级的位置不是默认的静态.

如果父亲也有相对,绝对或固定的位置,孙子将相对于父母的边界定位自己.

但是,如果孩子也有相对,则孙子将相对于孩子的边界定位自己,因为它是最近的父母,其位置不是静态的.

总之,相对影响元素的子元素,而绝对元素和固定元素影响元素本身及其子元素.

并记住该位置:fixed绕过所有相对父级和绝对父级,并始终相对于浏览器窗口定位自己.

猜你在找的CSS相关文章