ウェブサイト作成

インラインボックス

インラインボックスの領域

インラインボックスは親要素のブロックボックス(ボックスモデルと同義)に流し込まれる形で配置され、自動的に改行や折り返しされ、複数の行を生成します。インライン要素がインラインボックスを作るほか、ブロックボックスの中のインライン要素で定義されていないテキストも基本的にはインラインボックスを作ります。

 

ブロックボックスとインラインボックスの比較

この段落は、pタグ(ブロックボックス)にオレンジ色の実線のスタイルを定義して、spanタグ(インラインボックス)で赤色の破線とピンク色の背景のスタイルを定義しています。ブロックボックスが全体を囲んでいるのに対して、インラインボックスは行を囲んでいます。