absolute 的 containing block( 容器塊)計算方式跟正常流有什么不同?


無論屬於哪種,都要先找到其祖先元素中最近的 position 值不為 static 的元素,然后再判斷:
1、若此元素為 inline 元素,則 containing block 為能夠包含這個元素生成的第一個和最后一個 inline box 的 padding box (除 margin, border 外的區域) 的最小矩形;
2、否則,則由這個祖先元素的 padding box 構成。如果都找不到,則為 initial containing block。

補充:
1. static(默認的)/relative:簡單說就是它的父元素的內容框(即去掉 padding 的部分)
2. absolute: 向上找最近的定位為 absolute/relative 的元素
3. fixed: 它的 containing block 一律為根元素(html/body),根元素也是 initialcontaining block


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM