ホームページ >ウェブフロントエンド >CSSチュートリアル >Web サイトのスタイルを「html」または「body」に設定する必要がありますか?

Web サイトのスタイルを「html」または「body」に設定する必要がありますか?

Susan Sarandon
Susan Sarandonオリジナル
2024-11-07 07:33:03947ブラウズ

Should I Style My Website with 'html' or 'body'?

グローバル CSS スタイルを理解する: 'html' と 'body' の間の要素の選択

Web デザインでは、グローバル CSS スタイルはよく適用されます。 「html」タグと「body」タグ内の要素。この選択は恣意的に見えるかもしれませんが、考慮すべき微妙な違いがあります。

標準的な実践: グローバル スタイルを 'body' に適用する

伝統的に、グローバル ページ スタイルは「body」要素。これは、プレゼンテーション属性 (bgcolor、background など) が「body」に割り当てられる歴史的な優先順位によるものです。最新のブラウザでは、これらの属性は具体性の低い CSS ルールに変換され、ユーザー定義のスタイルが効果的に優先されます。

例外: HTML 固有のスタイルとビューポートの動作

「body」がデフォルトの選択ですが、特定のスタイルが「html」に適用されて、特定のブラウザの動作に影響を与える場合があります。たとえば、「html」の「overflow: hidden」のようなスタイルはスクロールバーを抑制できます。さらに、「html」と「body」のスタイルを組み合わせて興味深い視覚効果を得ることができます。

ビューポート コンテキスト

「html」要素はビューポート自体ではありません。ビューポートは、HTML ドキュメントとは異なる最初の包含ブロックを確立します。したがって、ビューポートを対象とする CSS は 'html' では使用できません。

継承可能なプロパティ

デフォルトで継承されるプロパティ (例: font-family) を次のいずれかに適用します。 「html」または「body」には実質的な違いはありません。選択した親要素に関係なく、スタイルは子要素に反映されます。

結論

グローバル CSS スタイル設定では 'body' が従来の選択ですが、その違いを理解することで、 「html」と「body」の役割により、効果的かつ柔軟な Web デザインが可能になります。どの要素をターゲットにするかを決定するときは、スタイルの目的と望ましい効果を考慮してください。

以上がWeb サイトのスタイルを「html」または「body」に設定する必要がありますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。