绝对定位的图像是相对于绝对定位父母的定位

我无法理解为什么绝对定位的子图像获得其父母的偏移量，这也是绝对的。但是，顾名思义它应该相对于定位到相对最近的祖先绝对定位的图像是相对于绝对定位父母的定位

.supparent { 
 
    width:100%; 
 
    height:300px; 
 
    position:relative; 
 
} 
 

 
.parent { 
 
    position:absolute; 
 
    top : 10%; 
 
    left:10%; 
 
} 
 

 
.im { 
 
    position:absolute; 
 
    top:0%; 
 
    left:0%; 
 
}

<div class="supparent"> 
 
    <div class="parent"> 
 
     <img src="https://tpc.googlesyndication.com/simgad/2621399702091823008" class="im"> 
 
    </div> 
 
</div>

，什么是黑客攻击，使其位置相对于supparent

来源

2017-01-30 Piyush Sharma

的可能的复制[位置绝对但相对父（http://stackoverflow.com/questions/10487292/position-绝对但相对于父母） – Troyer

根据定义：from MDN

绝对定位元素的位置相对于最近的定位的祖先（非静态）。如果定位祖先不存在，则使用初始容器。

看到此更新与一些有界的颜色。如果父设置position: relative;或position: absolute;不要紧

.supparent { 
 
    width:100%; 
 
    height:300px; 
 
    position:relative; 
 
    
 
    border: solid 5px orange; 
 
} 
 

 
.parent { 
 
    position:absolute; 
 
    top : 10%; 
 
    left:10%; 
 
    
 
    border: solid 5px red; 
 
} 
 

 
.im { 
 
    position:absolute; 
 
    top:0%; 
 
    left:0%; 
 
    
 
    border: solid 5px green; 
 
}

<div class="supparent"> 
 
    <div class="parent"> 
 
     <img src="https://tpc.googlesyndication.com/simgad/2621399702091823008" class="im"> 
 
    </div> 
 
</div>

来源

2017-01-30 10:01:15 caramba

是我的困惑是，为什么图像偏离顶部和左侧10％的偏移量。但我已经设置顶部和左偏移到0它应该触摸左边界和顶部边界 –

oh ok我得到了我的答案，谢谢 –

绝对定位的图像是相对于绝对定位父母的定位

回答

相关问题