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背景图像的最大尺寸

回答

相关问题