ホームページ > ウェブフロントエンド > CSSチュートリアル > CSS の高さのパーセントが機能しないのはなぜですか?

CSS の高さのパーセントが機能しないのはなぜですか?

Barbara Streisand
リリース: 2024-11-23 06:42:12
オリジナル
785 人が閲覧しました

Why Isn't My CSS Height in Percent Working?

CSS の高さがパーセントで機能しない: 解決された問題

要素の高さを 100% に設定すると、要素がその高さを占めることが期待されます。コンテナの高さ全体を確認しても、その動作を確認できないと、イライラする経験になる可能性があります。この問題は、要素の祖先も定義された高さを持つ必要があるために発生します。

これを解決するには、すべての親要素に 100% の高さを割り当てます。以下の例では、

<div>
ログイン後にコピー

親要素である html と body の高さも 100% に設定する必要があります。

html, body { height: 100%; width: 100%; margin: 0; }
ログイン後にコピー

すべての祖先要素が明確な高さを持っていることを確認することで、の場合、子要素 div はそのコンテナの高さ全体を正しく占有します。これは、その高さが含まれている要素に対して相対的であり、その要素の高さが定義されていないと、100% が何を表すのかが曖昧になるためです。

以上がCSS の高さのパーセントが機能しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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