画面のサイズが小さくなると、私の（ヒーロー）イメージが切り抜かれます。

Question

私はウェブサイトを作ろうとしていますが、問題があります。私はイメージを持っている、私はそれが常に完全な画面を埋めるために必要です。彼らはこのウェブサイトでのように：http://mollyandmepecans.com これは私のウェブサイトです：https://mountainweb-cemre2002.c9users.io/Homepage.html

ありがとう！

Answer 1

自分のイメージ要素を削除し、このCSSを追加します。

それとも、あなたがバックグラウンドを使用したくない場合は、お使いの画像要素を置き換えるために、あなたのHTMLにこれを追加します。

<div class="hero"></div> 

をあなたのCSSへ

そして、この：オブジェクトフィットあなたがIMG要素をカバーする必要がある場合

.hero { 
    position: fixed; 
    top: 0; 
    bottom: 0; 
    left: 0; 
    right: 0; 
    z-index: -100; 

    background-image: url("MountEverest.png"); 
    background-position: center; 
    background-repeat: no-repeat; 
    background-size:cover; 
} 

Answer 2

使用。

.hero{ 
    object-fit: cover; 
} 

https://css-tricks.com/almanac/properties/o/object-fit/