箱 (CSS)

[6] (ボックス) (box) は、CSS 箱モデルにおけるレンダリングの単位要素です。

目次

  1. 仕様書
  2. 状態
  3. 箱の領域
  4. 箱の分類
    1. 含める範囲の違い
    2. レンダリングの違い
  5. 歴史

仕様書#

状態#

[11] の持つ状態はいろいろあります。

[12]
における最初基線集合
における最後基線集合
支配的基線
揃え基線

箱の領域#

[2] (はこ) (box) は次の4つの領域 (area) で構成されます:

  1. 内容領域
  2. 詰め領域 (省略可能)
  3. 境界領域 (省略可能)
  4. 余白領域 (省略可能)

[3]領域の外周は (へん) (edge) といいます。

  1. 内容辺 (内辺)
  2. 詰め辺
  3. 境界辺
  4. 余白辺 (外辺)

箱の分類#

含める範囲の違い#

[4] >>3 の4により、内容箱詰め箱境界箱余白箱の4種類のが定義されます。

レンダリングの違い#

[5]

歴史#

[8] Editorial: link the term "CSS box" and remove parentheticals (zcorpan著, ) https://github.com/whatwg/html/commit/9058fe7ff6961a28fb6e87db55c7dfbbcbd63bb1

[9] Editorial: link the term "CSS box" and remove parentheticals by zcorpan · Pull Request #4659 · whatwg/html () https://github.com/whatwg/html/pull/4659

[10] Factor out "when it generates a box" · Issue #4618 · whatwg/html () https://github.com/whatwg/html/issues/4618