开发者社区> 问答> 正文

absolute的containing block计算方式跟正常流有什么不同?

已解决

absolute的containing block计算方式跟正常流有什么不同?

展开
收起
pandacats 2019-12-10 15:12:23 914 0
1 条回答
写回答
取消 提交回答
  • 采纳回答

    无论属于哪种,都要先找到其祖先元素中最近的 position 值不为 static 的元素,然后再判断:

    若此元素为 inline 元素,则 containing block 为能够包含这个元素生成的第一个和最后一个 inline box 的 padding box (除 margin, border 外的区域) 的最小矩形;

    否则,则由这个祖先元素的 padding box 构成。

    如果都找不到,则为 initial containing block。

    补充:

    static(默认的)/relative:简单说就是它的父元素的内容框(即去掉padding的部分)

    absolute: 向上找最近的定位为absolute/relative的元素

    fixed: 它的containing block一律为根元素(html/body)

    2019-12-10 15:12:39
    赞同 展开评论 打赏
问答地址:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载