CSS では、すべての HTML 要素をボックスとみなすことができ、「ボックス モデル」という用語はデザインとレイアウトで使用されます。
CSS ボックス モデルは本質的に、マージン、ボーダー、パディング、実際のコンテンツなど、周囲の HTML 要素をカプセル化するボックスです。
ボックス モデルを使用すると、他の要素と周囲の要素の境界線の間のスペースに要素を配置できます。
下の図はボックスモデルを示しています:
さまざまな部分の説明:
マージン - 境界領域をクリアします。マージンには背景色がなく、完全に透明です
Border - 境界線の周囲のパディングとコンテンツ。境界線はボックスの背景色の影響を受けます
Padding - コンテンツの周囲の領域をクリアします。ボックス内に塗りつぶされた背景色の影響を受けます
コンテンツ - テキストと画像を表示するボックスのコンテンツ
抜粋: W3CSCHOOL
http://www.w3cschool.cc/css/css- boxmodel.html
--------------------------------------------- ----- -------------------------------------- ----- ------------------------
BoxModule は特急パッケージのようなものです:
マージン: 特急プラスチック包装
境界線: 特急紙ボックス
詰め物: カートンの内壁に近い発泡ボードの層
内容: お客様のもの