关于position定位

position:absolute

  当其父元素设置了relative定位时,子元素就相对于父元素定位,注意:相对于父元素的content(内容区:padding+width)定位,不包括父元素的border与margin

  当父元素没有设置relative定位时,子元素相对于body定位

  而子元素定位的边界是子元素整体:margin + border +padding +width

  

<style type="text/css">
    .wrap{
        position: relative;
        height: 300px;
        width: 300px;
        border:10px solid blue;
    }
    .wrap>div{
        position: absolute;
        height: 100px;
        width: 100px;
        background-color: red;
    }
</style>


<div class="wrap">
    <div></div>
</div>

 

 

posted @ 2018-03-09 10:32  ITBoy-Men  阅读(145)  评论(0编辑  收藏  举报