css - CSS - jpg 拡張子で background-size が機能しない

Question

.baner {
    background-image: url('ban.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    position: fixed;
    width: 100%;
    height: 35%;
    top: 60px;
}

この背景についてはカバーしませんが、png画像を作成すると機能し、理由がわかりません:

.baner {
    background-image: url('ban.png');
    background-size: cover;
    background-repeat: no-repeat;
    position: fixed;
    width: 100%;
    height: 35%;
    top: 60px;
}

Answer 1

私にとっては完全に正常に動作します。おそらく、画像を保存していない可能性があります.jpg...

div.one {
    width:100px;
    height:100px;
    background-image:url(http://placekitten.com.s3.amazonaws.com/homepage-samples/408/287.jpg);
    background-position:center;
    background-repeat:no-repeat;
    background-size:cover;
}
div.two {
    width:500px;
    height:500px;
    background-image:url(http://placekitten.com.s3.amazonaws.com/homepage-samples/408/287.jpg);
    background-position:center;
    background-repeat:no-repeat;
    background-size:cover;
}

<div class="one">
    
</div>
<div class="two">
    
</div>