我的反应能力有问题。在我的例子中,右边有30个px空白位置。我不知道怎么解决它。有人知道吗?http://jsfiddle.net/98p3webw/的细节
.imageeee {
position:absolute;
max-width: 100%;
}
.logo{
max-width: 100%;
max-height: 100%;
}
.max{
width: 100%;
position:relative;
}
.background{
position:absolute;
width: 100%;
background-image: url("http://www.psdgraphics.com/file/colorful-triangles-background.jpg");
height: 100%;
background-size: cover;
}
<body>
<div >
<div class="row">
<center>
<img class="logo" src="http://i59.tinypic.com/dcbgiw.png">
</center>
</div>
<div class="background col-md-12">
<div class="max">
<div class="col-md-2"></div>
<div class="col-md-8 thumbnail" style="top: 40px;" >
<br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br>
</div>
<div class="col-md-2"></div>
</div>
</div>
</div>
发布于 2015-04-01 11:45:52
您所看到的15个像素间距是由Bootstrap的row
类添加的。
.row {
margin-left: -15px;
margin-right: -15px;
}
在引导中,.row
元素应该由.container
或container-fluid
元素包装。
来自引导文档的网格系统部分:
行必须放置在
.container
(固定宽度)或.container-fluid
(全宽度)内,以便正确地对齐和填充。
因此,将.row
元素封装在.container
中应该可以解决眼前的问题。
<div class="container">
<div class="row">
<center>
<img class="logo" src="http://i59.tinypic.com/dcbgiw.png">
</center>
</div>
</div>
二读:
您可能需要阅读网格系统的引导文档,以便确保在其他地方正确使用它。另外,不推荐使用标记,您应该使用CSS test-align
属性。
https://stackoverflow.com/questions/29399177
复制相似问题