Body 要素の背景スタイルが画面全体を覆うのはなぜですか?

Body 要素の背景のスタイル設定が境界を超えて拡張されるのはなぜですか?

Body 要素の背景をスタイル設定するとき、次のことに気づくかもしれません。スタイリングは本体だけでなく画面全体に適用されます。この動作を理解するために、CSS ルールとブラウザのレンダリング プロセスの複雑さを詳しく調べます。

CSS 2.1 仕様によると、「ルート要素の背景がキャンバスの背景になり、キャンバス全体を覆います」 」。これは、Web ページのルート要素である body 要素に背景のスタイルを適用すると、そのスタイルが body だけに適用されるのではなく、キャンバス全体 (ブラウザ ウィンドウ内の領域) に適用されることを意味します。

その結果、背景スタイルはボディに適用されなくなり、ボディは独自の背景を失います。代わりに、背景スタイルがキャンバスに直接適用されるため、画面全体が影響を受けます。これにより、ページのレンダリングの一貫性が確保され、本文の背景色がキャンバスの背景を上書きして視覚的な不一致が生じることがなくなります。

ただし、ボーダーなどの他のスタイル プロパティは本文要素から分離されたままになります。 。したがって、提供されている例では、境界線の幅は body 要素に指定されているとおり 700 ピクセルのままですが、背景色はキャンバスに適用されるため、画面全体に広がります。

以上がBody 要素の背景スタイルが画面全体を覆うのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。