Div背景圖像的最大尺寸

我在設置div背景圖像的最大高度時遇到了一些問題。最大高度應該是圖像的高度，不能大於此值。如果div中的內容太多，它只是放大圖片。當背景圖像結束時，我希望它爲我的其餘內容繼續使用背景顏色。這裏是我試過的代碼Div背景圖像的最大尺寸

<style> 
    .profilbg { 
     background: url(<?php echo $uin->backgroundimg; ?>); 
     background-repeat: no-repeat; 
     background-size:cover; 
    } 
    .profilen { 
     width: 100%; 
     text-align: left; 
     clear: both; 
    } 
</style> 
<div class="profilen"> 
    <div class="profilbg"> 
     <?php echo nl2br($uin->profilen); ?> 
    </div> 
</div>

有了這段代碼，背景圖片只是放大並且變大，如果內容太多的話。

來源

2016-03-21 Patric Nøis

我知道這alreay解決，但它會很容易做到絲毫background-size: 100%; 當您使用的覆蓋，將覆蓋整個頁面，但如果你使用100％它將覆蓋頁面白色背景黑色geting放大客棧

來源

2016-09-18 11:55:57

您可以使用此CSS規則的背景圖片：

.profilbg { 
    background: url(<?php echo $uin->backgroundimg; ?>) no-repeat #000 // Your bg color; 
    background-size: 100%; 
}

這將給你的背景圖片100％只有寬度，不包括高度和圖像後，背景顏色就會自動出現。

來源

2016-03-21 11:10:01

.profilbg { 
background: url(<?php echo $uin->backgroundimg; ?>) no-repeat #000 ; 
background-size:100%; 

}

或

.profilbg { 
    background: url(<?php echo $uin->backgroundimg; ?>) no-repeat #000 ; 
    max-height:100%; 

    }

試試吧......

來源

2016-03-21 11:11:55

改變你的CSS規則這一點，就會使圖像是全寬，高達其長寬比使得它，排列在頂部和填充剩餘的空間用紅色

.profilbg { 
    background: #f00 url(<?php echo $uin->backgroundimg; ?>); 
    background-repeat: no-repeat; 
    background-size: 100% auto; 
    background-position: center top; 
}

使用背景速記

.profilbg { 
    background: #f00 
       url(<?php echo $uin->backgroundimg; ?>) 
       no-repeat 
       center top/100% auto; 
}

樣品

div { 
 
    background: #f00 
 
       url(http://www.placehold.it/1000x150) 
 
       no-repeat 
 
       center top/100% auto; 
 

 
    /* temp for test */ 
 
    height: 300px; 
 
}

<div></div>

來源

2016-03-21 11:23:36 LGSon

Div背景圖像的最大尺寸

回答

相關問題