談BFC和haslayout

時間 2019-11-12

標籤 bfc haslayout 简体版

原文原文鏈接

今天提到BFC和haslayout，就順帶在網上查查資料，總結一下它們。html

CSS2咱們再熟悉不過，固然它裏面咱們須要掌握的，就是CSS2的選擇器和佈局，選擇器總共31種。避開這個不說，咱們說佈局。編程

佈局常常用到的有浮動、定位，固然也須要知道盒子模型，這裏的盒子模型不是說就是內邊距、外邊距、邊框等，他們只是其中的一種。瀏覽器

盒子模型總共有5個：1) BFC；2) haslayout；3) 元素盒；4) EM盒；5) 行盒app

BFC：佈局

含義：顧名思義就是Block Formatting Context。spa

怎麼觸發造成：.net

float 不能設置爲 none。
overflow 不能設置爲 visible。
display 的值爲（table-cell、table-caption、inline-block）。
position 不能設置爲 relative 和 static。

haslayout：code

含義：「Layout」是一個 Internet Explorer for Windows的私有概念，它決定了一個元素如何顯示以及約束其包含的內容、如何與其餘元素交互和創建聯繫、如何響應和傳遞應用程序事件、用戶事件等。這種渲染特性能夠經過某些 CSS 屬性被不可逆轉地觸發。而有些 HTML 元素則默認就具備」layout」。微軟的開發者們認爲元素都應該能夠擁有一個」屬性(property)」(這是面向對象編程中的一個概念)，因而他們便使用了 hasLayout，這種渲染特性生效時也就是將 hasLayout 設成了 true 之時orm

由來：不一樣於標準屬性，也不像某些瀏覽器的私有 CSS 屬性，layout 沒法經過某一個 CSS 聲明直接設定。也就是說沒有」layout屬性」這麼一個東西，元素要麼自己自動擁有 layout，要麼藉助一些 CSS 聲明悄悄地得到 layout。htm

下列元素應該是默認具備 layout 的：

<html>, <body>
<table>, <tr>, <th>, <td>
<img>
<hr>
<input>, <button>, <select>, <textarea>, <fieldset>, <legend>
<iframe>, <embed>, <object>, <applet>
<marquee>

做用：

清除浮動；

不和浮動元素重疊（效果同BFC）；

水平兩欄自適應排版；

.second-item { overflow: hidden; *zoom: 1;//IE6 }

1. BFC和haslayout
2. BFC 和 haslayout
3. BFC，hasLayout
4. BFC、haslayout
5. 說說bfc 和 HasLayout
6. CSS BFC 和 IE hasLayout
7. 談談BFC與ie特有屬性hasLayout
8. CSS BFC和IE Haslayout介紹
9. CSS BFC hasLayout模型
10. 關於Block Formatting Context－－BFC和IE的hasLayout
更多相關文章...
• XLink 和 XPointer 語法 - XLink 和 XPointer 教程
• Kotlin 類和對象 - Kotlin 教程
• 漫談MySQL的鎖機制
• Docker容器實戰(八) - 漫談 Kubernetes 的本質

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。