position：absolute 跑出付父级盒子

最新推荐文章于 2023-09-10 16:49:03 发布

螺纹钢铁侠

最新推荐文章于 2023-09-10 16:49:03 发布

阅读量1k

点赞数

分类专栏： html css

本文链接：https://blog.csdn.net/cc9200/article/details/101610711

版权

css 同时被 2 个专栏收录

7 篇文章 0 订阅

订阅专栏

html

6 篇文章 0 订阅

订阅专栏

absolute 定位

绝对定位的元素的位置相对于最近的已定位父元素，如果元素没有已定位的父元素，那么它的位置相对于<html>:

这是菜鸟上的定义

什么叫已定位的父元素？

就是position有设定，而且不是static是外层元素

 div#a {
            background-color: aqua;
            width: 300px;
            height: 300px;
            display: block;
            position: static;
            /* float: left */
            
        }
        div#a_1 {
            position: absolute;
            width: 200px;
            height: 200px;
            right:0px;
            bottom:0%;
            background-color: blue;

a_1是a的子元素

如果div#a的position是static，则iv#a是没有定位的元素，div#a_1的absolute将不以a为标准，而是继续往上找，如果一直找不到，则以html元素为相对坐标

static 定位

HTML 元素的默认值，即没有定位，遵循正常的文档流对象

螺纹钢铁侠

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
position：absolute 跑出付父级盒子

absolute 定位绝对定位的元素的位置相对于最近的已定位父元素，如果元素没有已定位的父元素，那么它的位置相对于<html>:这是菜鸟上的定义什么叫已定位的父元素？就是position有设定，而且不是static是外层元素 div#a { background-color: aqua; width: 300p...
复制链接

扫一扫