ホームページ  >  記事  >  ウェブフロントエンド  >  ボックスモデルとは

ボックスモデルとは

王林
王林オリジナル
2020-05-30 16:07:084287ブラウズ

ボックスモデルとは

ボックスモデルとは何ですか?

CSS ボックス モデルは本質的に、マージン、ボーダー、パディング、実際のコンテンツなどの周囲の HTML 要素をカプセル化するボックスです。

ボックス モデルを使用すると、他の要素と周囲の要素の境界線の間のスペースに要素を配置できます。

ボックス モデルの画像:

ボックスモデルとは

(ビデオ チュートリアルの推奨: css ビデオ チュートリアル)

コンポーネントの紹介:

Margin (マージン) - 境界線の外側の領域をクリアし、マージンが透明になります。

境界線 (境界線) - パディングとコンテンツの周囲の境界線。

Padding (パディング) - コンテンツの周囲の領域をクリアし、パディングを透明にします。

コンテンツ (コンテンツ) - ボックスのコンテンツであり、テキストと画像が表示されます。

要素の高さと幅

CSS 要素の幅と高さのプロパティを指定するときは、コンテンツ領域の幅と高さを設定するだけです。フルサイズの要素には、パディング、ボーダー、マージンなども含まれます。

例:

ボックスモデルとは

レンダリング:

ボックスモデルとは

推奨チュートリアル:CSS の基本チュートリアル

以上がボックスモデルとはの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。