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%; width:500px; height:500px;
        margin-top: -250px;
        margin-left: -250px;
        background:blue;
    }
    .smallBig1{
        position: absolute;background:pink; top:0; left:0;width:200px;
        height:200px;
    }

　　效果：

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

　　

posted @ 2016-12-23 11:01  niu2016  阅读(112)  评论(0)  编辑  收藏  举报