為什麼CSS2.1 定義「visible」以外的溢位值來建立新的區塊格式化上下文
CSS2.1 規範要求除「visible」以外的溢位值建立新的區塊格式化上下文(BFC)。這個決定可能看起來違反直覺,因為溢出通常用於隱藏內容而不影響佈局。然而,這種選擇背後卻有令人信服的理由。
可捲動內容和效能
將不可見溢位值定義為 BFC 的主要動機是為了增強滾動期間的效能。當浮動元素與其父容器外部的可捲動內容相交時,瀏覽器必須在每次捲動時重新包裹浮動元素周圍的內容。如果瀏覽器需要實作原始 CSS2 規範,這種不斷的重新包裝將顯著影響滾動速度。
與其他溢位值的一致性
此決定的另一個因素是一致性。雖然溢出:「隱藏」可能看起來只是簡單地剪輯其容器內的內容,但它仍然可以透過程式滾動。因此,指定不可見的溢出值始終會導致新的 BFC,無論內容實際上是否可捲動。
透過替換元素統一行為
CSS2。 1 也引入了區塊格式化上下文根 (BFCR) 的 height: "auto" 行為方式的變更。高度為“auto”的 BFCR 現在垂直拉伸以容納浮動。這與替換元素(例如圖像)的行為一致,替換元素本質上會創建 BFC 並拉伸以適合其內容。
不可見溢位的好處
透過將不可見溢位值定義為BFC、CSS2.1確保:
以上是為什麼非「可見」溢出值會在 CSS2.1 中建立新的區塊格式化上下文?的詳細內容。更多資訊請關注PHP中文網其他相關文章!