tam genişlikli arka plan görüntüsü sınırlı yükseklik

Question

Ben tam ekran arka plan resmi ama sadece genişlik, yükseklik değil almak istiyorum

, here

Ben background-size:cover; ile oynamak oldum ama bu tüm sayfayı kaplayan gibi - ve sadece belli bir yüksekliğin kaplanmasını istiyorum.

Answer 1

Söz ettiğiniz site, sabit bir height ve width: 100% numaralı bir div üzerinde standart bir arka plan resmi kullanmaktır.

Örneğin söz sitesi kullanır:

header { 
    height: 460px; 
    margin-top: -69px; 
    overflow: hidden; 
    padding: 0px; 
    width: 100%; 
} 

Bildirim kod bloğunda yüksekliği background-image: cover sadece alana sığacak şekilde arka plan resmini ölçeklendirme anlamına gelir.

Answer 2

yüzden ben aradığımı buldum:

CSS:

#header-wrapper{ 
    top: 0; 
    left: 0; 
    height: auto; 
    position: absolute; 
    width: 100%; 
} 

HTML: tüm yardım için

<div id="header-wrapper"> 
    <img src="image.jpg" width="100%" style="border-bottom:1px solid black;"> 
</div> 

teşekkürler!

Answer 3

background-size: 100% 80% nasıl yapılır (örneğin).
Yükseklik olan ikinci değeri değiştirebilirsiniz.

İşte bir fiddle.