HTML ドキュメントの CSS 背景のグラデーションで問題が発生しています。線形グラデーションを背景として使用し、body要素に設定するページをデザインしました。私が直面している問題は、スクロールするコンテンツがまだあるにもかかわらず、グラデーションが最初に画面が終了する場所で終わっているように見えることです。したがって、下にスクロールすると、グラデーションの 2 番目のインスタンスが最初から始まっているように見えます。
これは私の現在の CSS (SCSS) コードです:
リーリー期待される動作は、スクロールする必要があるために最初は表示されないコンテンツも含めて、グラデーションが常に画面全体をカバーすることです。 2 つのグラデーション インスタンスが存在することは避けたいと考えています。基本的に、グラデーションは画面の高さ、さらにはスクロールの高さに適応する必要があります。
height: auto;min-height:100%; などの別の CSS プロパティと値を使用してみましたが、これらは機能しないようです。私も繰り返さずに試してみましたが、それは書き込み四角形を表示することです。助けていただければ幸いです。 エラーを再現するために必要な場合に備えて、HTML は次のとおりです:
リーリー以下のコード スニペットのデモ:
リーリー リーリー
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
この問題では、
background-repeatおよびbackground-attachmentプロパティをno-repeatおよびfixed代码> として含めるだけです。 、html タグと body タグのheight属性を100%に設定します。 同様の回答gradient-wrapper
クラスを追加しました