背景大小屬性弄亂我的標題

我有一個600px高的標題，它使用背景圖像作爲其bg。當屏幕超過1600像素時，我使用封面並且默認包含。重疊標題是一個500像素高的圖像（絕對定位）。背景大小屬性弄亂我的標題

當我調整瀏覽器的大小時，標題不會保持其高度，這可以通過與標題重疊的疊加圖像輕鬆看到。

下面是代碼：

/* ===== HEADER ==== */ 

header{ 
height: 600px; 
min-height:600px; 
width:100%; 
min-width:100%; 
background-image: url(../images/headerBG.jpg); 
background-repeat: no-repeat; 
background-size: contain; 

} 
#bgOverlay{ 
position: absolute; 
top: 60px; 
left: 30%; 
} 

/* ==== MEDIA QUERIES ==== */ 
@media only screen and (min-width:1600px){ 
header{background-size: cover;} 
}

而且看到它的鏈接：http://www.madebym.net/test/crazysunsets/index.html

來源

2012-12-17 suludi

如果你把'background-size：1600px 600px'怎麼辦？它保持你的背景的高度和寬度（不知道這是你想要做的） – cheesemacfly

我希望我的標題始終是600px高，並且bg-image可以用封面和包含進行縮放。 – suludi

所以你的背景圖片不會保持正確的比例？ – cheesemacfly

要解決我的問題，需要申請：背景尺寸：100％600px的;

這樣標題總是600px高，圖像保持其縱橫比。

來源

2012-12-17 22:22:27 suludi

背景大小屬性弄亂我的標題

回答

相關問題