ホームページ > ウェブフロントエンド > CSSチュートリアル > 背景のグラデーションが画面全体を確実に埋めるにはどうすればよいですか?

背景のグラデーションが画面全体を確実に埋めるにはどうすればよいですか?

DDD
リリース: 2024-10-30 16:51:25
オリジナル
408 人が閲覧しました

How to Ensure a Background Gradient Fills the Entire Screen?

背景のグラデーションを画面全体に拡張する

魅力的な放射状のグラデーションが Web ページの背景として使用されるシナリオでは、グラデーションがページのコンテンツが画面全体を占めるには至らない場合、突然終了します。

この問題を解決し、要素がページ全体のサイズを想定していることを保証するには、次のコード スニペットを実装できます:

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

このコードは、 の両方を設定します。そして

要素をページの境界に揃えます。余白をすべて削除し、高さを 100% に設定すると、要素が画面全体を囲むように拡張され、背景のグラデーションが途切れることなく表示されます。

以上が背景のグラデーションが画面全体を確実に埋めるにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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