我在另一个 div 中有两个 div,我想使用 css 将一个子 div 放置在父 div 的右上角,将另一个子 div 放置在父 div 的底部。即,我想对两个子 div 使用绝对定位,但相对于父 div 而不是页面定位它们。我怎样才能做到这一点?
示例 html:
<div id="father"> <div id="son1"></div> <div id="son2"></div> </div>
#father { position: relative; } #son1 { position: absolute; top: 0; } #son2 { position: absolute; bottom: 0; }
之所以可行,是因为position: absolute它的意思是“使用top, right, bottom,left将自己定位于与拥有position: absolute或的最近祖先的关系position: relative”。
position: absolute
top
right
bottom
left
position: relative
所以我们 make #fatherhave position: relative,而孩子们 have position: absolute,然后使用topandbottom来定位孩子们。
#father