ホームページ > ウェブフロントエンド > CSSチュートリアル > body 要素の背景のスタイルを設定すると画面全体に影響するのはなぜですか?

body 要素の背景のスタイルを設定すると画面全体に影響するのはなぜですか?

Patricia Arquette
リリース: 2024-12-15 19:59:15
オリジナル
489 人が閲覧しました

Why Does Styling the Body Element's Background Affect the Entire Screen?

body 要素の背景のスタイル設定の不思議な効果

body 要素の背景にスタイルを適用すると、開発者は次のような問題に遭遇する可能性があります。スタイルが要素自体を超えて拡張され、画面全体に影響を与える予期しない現象。この動作は、Web サイトのキャンバスと body 要素の関係の固有の性質に起因します。

w3.org/TR/CSS21/colors.html の CSS 仕様によれば、ルート要素の背景プロパティは、 body要素は「キャンバスの背景となり、キャンバス全体を覆います」。その結果、Web ページ全体の背景として機能し、ルート要素の位置に固定されます。

実際には、body 要素の背景のスタイルが設定されると、元の背景が消え、新しいスタイルが適用されます。画面全体に適用されます。これは、ボディ要素自体に適用される他の寸法やスタイルに関係なく発生します。提供されている例では、body 要素の境界線は幅 700 ピクセル内で表示されたままですが、背景色はブラウザのビューポート全体を囲んでいます。

したがって、body 要素自体を超えてスタイルが明らかに拡張されているのは、次の結果です。ルート要素としての body 要素の役割と、Web ページのキャンバスとの相互作用。

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

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート