如何在我的页面中完善jumbotron图像

我选择的图像太大，不适合垂直或水平页面。这里是我有：如何在我的页面中完善jumbotron图像

<style> 

.jumbotron { 
height: 500px; 
width: 100%; 
} 
.jumbo-container { 
background-image: url('../img/challenge2.jpg'); 
background-repeat: no-repeat; 
background-size: cover; 
width: 100%; 
} 
</style> 

<body> 
<div class="jumbotron"> 
    <div class="jumbo-container"> 
    </div> 
</div> 
</body>

链接到我想要的图片：http://fc09.deviantart.net/fs71/f/2010/347/0/2/life_challenges_by_eddieretelj-d34scch.jpg

来源

2015-02-08 Walt

不完全确定你在问什么，但我增加了身高：100％;检查小提琴; http://jsfiddle.net/mhussa19/r0pq2zra/ – Phreak 2015-02-08 23:38:51

@Phreak在您的小提琴中水平切割图像。我如何防止这种情况发生？ – Walt 2015-02-08 23:40:54

这是什么问题？ – 2015-02-08 23:42:58

如果我理解正确的话，你可能需要使用该看看我的小提琴background-size: 100% auto;http://jsfiddle.net/mhussa19/r0pq2zra/2/

.jumbotron { 
height: 500px; 
width: 100%; 
} 
.jumbo-container { 
background-image: url(' http://fc09.deviantart.net/fs71/f/2010/347/0/2/life_challenges_by_eddieretelj-d34scch.jpg'); 
background-repeat: no-repeat; 
background-size: 100% auto; 
width: 100%; 
    height:100%; 
}

来源

2015-02-08 23:52:35 Phreak

图像仍被垂直截取：/ – Walt 2015-02-09 00:00:43

background-image: url('../img/challenge2.jpg'); height:100%; width:100%;

应该工作

来源

2015-02-08 23:53:32 j8ey

如何在我的页面中完善jumbotron图像

回答

相关问题