「要素を全画面の背景のビューポート全体に埋めるにはどうすればよいですか?」

を伸ばす要素の全画面

Q: 背景として Web ページに放射状のグラデーションを適用しました:

<code class="css">background-image: -webkit-gradient(radial, 100% 100%, 10, 90% 90%, 600, from(#ccc), to(#000));</code>

しかし、ページのコンテンツが表示されない場合、グラデーションが不鮮明になります。全画面を占有しないでください。

を確実にするにはどうすればよいですか?要素は常にビューポート全体を埋めるように拡張されますか?

A: これを実現するには、次の CSS ルールを使用します。

<code class="css">html, body {
    margin: 0;
    height: 100%;
}</code>

これにより、

の周囲にマージンがなくなるようになります。要素がページの高さ全体に及ぶことを確認します。その結果、コンテンツの長さに関係なく、一貫した放射状のグラデーションの背景が維持されます。

以上が「要素を全画面の背景のビューポート全体に埋めるにはどうすればよいですか?」の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。