上次我們在 Simple Block, Simple Inline  裡面從 HTML  和 CSS  兩方面稍為了解了 block 和 inline 和它們之間的分別,今次我們將會更全面地看看 CSS 中所謂的 block boxes 。  對於 display  property ,下面的 value 會令一個 element 變成 block-level (從這裡開始我們會稱這些 elements 為 block-level elements) 。    block   list-item   run-in (某些情況)   table (有點不同)   另外還有 floats  和 absolute positioning  的場合會產生 block boxes ,這不在本文的討論範圍內。   Principal Block Boxes  Block-level elements (table 除外) 會產生所謂的 principal block boxes  ,這 principal block boxes 中只能容納 block boxes 或是 inline boxes ,不能兩樣都有。   Anonymous Block Boxes  那麼,如果像下面遇到同時含有 block content 和 inline content 的場合要怎麼辦呢?  <div>  Some Text  <p>More Text</p>  Much More Text </div>  如此這般 CSS 會假定 "Some Text" 和 "Much More Text" 也被一個 block boxes 包圍著,而這些虛構的 boxes 便是所謂的 anonymous block boxes  ,請看下圖。   就是說 div  principal block box 裡面有三個 block boxes 。    包圍著 "Some Text" 的 anonymous block box 。   p  block box 。   包圍著 "Much More Text" 的 anonymous block box 。    List-Item B...