Inline-level content (インラインレベルコンテンツ)

CSS において、インラインレイアウトに関係するコンテンツはインラインレベルコンテンツと呼ばれます。ほとんどのテキストシーケンス、置換要素、および生成されたコンテンツは、デフォルトでインラインレベルです。

インラインレイアウトでは、テキスト、置換要素、その他のインラインボックスが混在したストリームを、行ボックスのスタックに断片化することでレイアウトされます。各行ボックスの中でインラインレベルのボックスは、書字方向に応じて互いに垂直または水平に整列されます。一般的には、テキストのベースラインによって整列されます。これは、CSSで変更することができます。

  この span はインラインレベル要素です。
  背景は、この要素の影響の始まりと終わりの両方を表示するように色付けされています。
   や  のような input
  要素もインラインレベルコンテンツです。

body {
  margin: 0;
  padding: 4px;
  border: 1px solid #333;
}

.highlight {
  background-color: #ee3;
}