【发布时间】:2016-08-25 07:21:44
【问题描述】:
我试图尽可能地重建一切。 CSS:
.container-fluid-max {
max-width: 1440px;
height: 300px;
background-color: black;
margin: 30px 0;
}
.bg-img{
margin: 0px;
padding: 0px;
height:300px;
border: 3px 0 solid $b-black;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
.bg-img img{
max-height:450px;
position:absolute;
bottom: 0px;
}
https://jsfiddle.net/DTcHh/19984/
我的问题:我试图让图像居中。因为在我的项目中,img 总是一个不同的/随机的,我无法真正说出它的高度/宽度。只是说我不希望它高于 450px。
而且进入上面的div也没问题。这就是我想要实现的目标。
【问题讨论】:
-
你能用 flexbox 做吗?这个工作吗jsfiddle.net/DTcHh/19985
-
' 位置:绝对;左:50%;最高:50%;'
-
你已经定义了 col-xs-12 并且它占据了整个屏幕,所以你可能想试试 col-xs-10 col-xs-offset-1 或 col-xs-8 col-xs- offset-2 使元素居中
标签: html css image twitter-bootstrap responsive-design