absolute的新认识

在做项目的时候,需要用到定位。当时对于这个定位的认识就是absolute不论他在哪个位置,都要找到他的父元素。

举例:

<body>
            <div class="bigBox">
                               <div class="smallBig1"></div> 
                               <div class="smallBig2"></div> 
                               <div class="smallBig3"></div> 
                               <div class="smallBig4"></div> 
            </div>
</body>

插入样式:

 .bigBox{
        position:absolute;top:50%;left:50%; 500px; height:500px;
        margin-top: -250px;
        margin-left: -250px;
        background:blue;
    }
    .smallBig1{
        position: absolute;background:pink; top:0; left:0;200px;
        height:200px;
    }

  效果:

      大盒子居中,smallBig1不是相对于<body>定位。而是相对于父亲bigBox定位于的左上。而不是<body>的左上

  

原文地址:https://www.cnblogs.com/nf1206/p/6214016.html