背景图像高度100％

我正在寻找我的问题的解决方案。背景图像高度100％

我使用Twitter的引导在移动网站上，这是我在移动视图结果：

background-size:contain; 
background-repeat: no-repeat; 
background-position: center center; 
width: 100%; 
height: 300px;"

：

enter image description here

<div class="row"> 
    <div class="span4"> 
     <div class="visible-phone" style="background-image: url('http://upload.tapcrowd.com/upload/catalogimages/719/[email protected]');></div> 
     <p class="metadataTitle metacell"> 
     <span style="display: inline-block" class="ellipsis">Car Dealers</span> 
     <span style="table-row"></span></p> 
     </div> 
    </div> 
</div>

在我的形象是在div的CSS

但是，正如你所看到的，图像和下面的内容之间有一段距离，有谁知道我该如何解决这个问题？

来源

2013-05-31 nielsv

请确保在CSS内容中设置了“Margin：0px”。 – Navigatron

设置margin:0; padding:0;双方的形象和下面的内容。这将删除任何保证金。由于默认情况下HTML会添加边距，因此您需要明确告诉HTML以删除边距。

来源

2013-05-31 08:14:27 imulsion

background-size：contains;

https://developer.mozilla.org/en-US/docs/Web/CSS/background-size：

“包含：该关键字指定背景图像的规模应同时确保尽可能大的其两个尺寸小于或等于的对应尺寸背景定位区域“。

所以，你的图像已被缩放，使得它适合的元素完全 - 你似乎想用cover代替：

“封面：这个关键字指定了背景图片应该是缩小到尽可能小，同时确保其尺寸大于或等于背景定位区域的对应尺寸。“

来源

2013-05-31 08:19:51 CBroe

背景图像高度100％

回答

相关问题