CSS布局：表格&& BFC&&IFC

cellpadding&cellspacing

• 單元格邊距(表格填充)(cellpadding) – 單元邊沿與其内容之間的空白
• 元格間距(表格間距)(cellspacing) – 代表表格邊框與單元格補白的距離,也是單元格補白之間的距離。

  

children和.html()和contents()差別

• contents() 方法獲得比對元素集合中每個元素的子節點，包括文本和注釋節點。
• find() 方法獲得目前元素集合中每個元素的後代，通過選擇器、jQuery 對象或元素來篩選。
• html() 方法傳回或設定被選元素的内容 (inner HTML)，傳回dom結構
• children() 方法傳回比對元素集合中每個元素的子元素，而不管子元素的子元素。

BFC&IFC

塊級格式化上下文（block formatting context）

常見的文檔流分為：定位流、浮動流、普通流3種。BFC是普通流中的一種。

• 規則：
  1. 内部的Box會在垂直方向上放置
  2. margin決定Box垂直的距離，同屬一個BFC的兩個相鄰Box的margin發生重疊
  3. 每個元素margin box的左邊，與包含塊的左邊相接觸。（從左到右的格式化）
  4. BFC的區域不會和float Box重疊
  5. BFC是頁面上一個隔離的獨立容器
  6. 計算BFC的高度，浮動元素也參與計算。（可解決父元素塌陷問題）

float: left | right
position: fixed | absolute
display: inline-block | table-cell | table-caption | flex | inline-flex
overflow: hidden | scroll | auto
           

行内格式化上下文（inline formatting context）

• 元素從左到右，從上到下排布
• 每個元素都可通過vertical-align設定垂直方向上的對齊