2013-02-27 11 views
5

ブロックレベルボックスとプリンシパルブロックレベルボックスの違いは何ですか? <a href="http://www.w3.org/TR/CSS21/visuren.html" rel="nofollow">spec</a>を引用する

ブロックレベルボックスは コンテキストをフォーマットブロックに参加ボックスです。各ブロックレベル要素は、子孫ボックスと生成されたコンテンツを含む基本ブロックレベルの ボックスを生成し、 任意の配置スキームに関係するボックスです。いくつかのブロックレベル要素 は、プリンシパルボックスに加えて追加のボックス: 'list-item'要素を生成することがあります。これらの追加ボックスは、 に関して、プリンシパルボックスに配置されます。

本質的に同じですか?

+0

どちらも同じです –

+0

質問を修正して追加する必要があります:これは、DOMツリーに対応する要素/ノードを持つブロックボックスを意味しますか? –

答えて

9

主要なブロックレベルのボックスは、要素に適用されるスタイルルールの影響を直接受けるブロックレベルのボックスです。

ほとんどの要素は1つのボックスしか生成しません。これらの要素の場合、であり、他のボックスは含まれていないため、本質的に同じものです。

ただし、エレメントは、list itemなど、その表示タイプに応じて複数のボックスを生成できます。そのような要素のスタイルを宣言すると、スタイルは通常プリンシパルボックスに適用され、生成される追加のボックスはそれに応じてレンダリングされます。

たとえば、リスト項目には、プリンシパルボックスに加えてマーカーボックスがあります。 list-style-position: outsideを指定すると、リストマーカーはプリンシパルボックスの境界の外側に配置されますが、プリンシパルボックスの背景と境界線は影響を受けません。マーカーボックスはプリンシパルボックスの子孫であることに注意してください。colorなどの継承可能なプロパティがマーカーに適用されます(これはcolor: redがテキストとその箇条書きマーカーを赤くする理由です)。

display: table除くdisplay: blockしかしを含む他のほとんどのブロックレベル要素、(section 17.4を参照)、単純に基本的に単に「ブロックボックス」作り、その内容と他には何のための主要ブロックボックスを生成しますが、唯一のそれらのため要素。

つまり、主要なブロックレベルのボックスはすべてブロックレベルのボックスですが、すべてのブロックレベルのボックスがプリンシパルではありません(例:anonymous block boxes)。また、インラインブロックを含むインライン要素は、プリンシパルボックス自体を生成しませんし、プリンシパルインラインボックスなども存在しません。

+1

ありがとうございます。言い換えれば、匿名のボックスはプリンシパルボックスにはなれないと思います。ところで、*主ブロックボックスは、スタイルルール*の影響を直接受けるブロックボックスです。DOMツリーに対応する要素/ノードを持つブロックボックスを意味しますか? – h2o

+0

@Bill Jobs:はい、そうです。 – BoltClock

0

プリンシパルブロックは機械的目的のために、機械的目的のために、正しく表示されるためには他の要素を必要とします。スクロールバーをテキストエリアから)

関連する問題