题解 | #定位 - absolute#

定位 - absolute

http://www.nowcoder.com/practice/4a7cd2e295604c5ca30380b61506208b

绝对定位会把元素拿出文档流,不会再占据原来的空间。绝对定位元素的父级是距离该元素最近的定位祖先,也就是"position"属性不为"static"的最近任意祖先。如果没有这个定位祖先,那么绝对定位元素就相对于文档的根元素"html"进行定位。

<html>
    <head>
        <meta charset=utf-8>
        <style type="text/css">
            * {
                margin: 0;
                padding: 0;
            }
            .outer {
                width: 100px;
                height: 100px;
                padding-left: 10px;
                background: red;
            }
            .middle {
                position: absolute;
                width: 100px;
                height: 100px;
                padding-left: 10px;
                background: blue;
            }
            .inner {
                position: absolute;
                left: 0px;
                width: 100px;
                height: 100px;
                padding-left: 10px;
                background: yellow;
            }
        </style>
    </head>
    <body>
    	<div class="outer">
            <div class="middle">
                <div class="inner">
                    
                </div>
            </div>
        </div>
    </body>
</html>
全部评论

相关推荐

把球:这个听过,你加了就会发现是字节的hr
点赞 评论 收藏
分享
10-05 11:11
海南大学 Java
投票
理想江南137:感觉挺真诚的 感觉可以试一试
点赞 评论 收藏
分享
点赞 1 评论
分享
牛客网
牛客企业服务