这就是我想要做的:
这就是我所拥有的:
这是我的代码:
HTML
<div class="row">
<div class="col-md-4">col-md-4</div>
<div class="col-md-6">col-md-6 ...</div>
<div class="col-md-2">col-md-2</div>
</div>
CSS
.col-md-4,.col-md-2 {
background-color: #e3e3e3;
}
.col-md-6 {
background-color: #f5f3f3;
}
我检查了有关该主题的其他问题,但我对答案不满意...有人可以帮助我改进我的代码吗?谢谢!
最佳答案
在中查看JSFiddle...
我希望你正在寻找这个输出。如果是,则尝试以下代码:
HTML:
<div class="row">
<div class="col-md-4 row-height">
<span>col-md-4</span>
</div>
<div class="col-md-6 row-height">
col-md-6
</div>
<div class="col-md-2 row-height">
col-md-2
</div>
</div>
和 CSS:
.row {
padding: 100px;
}
.row-height {
height: 70px;
text-align: center;
padding-top: 25px;
}
.col-md-4,.col-md-2 {
background-color: #e3e3e3;
}
.col-md-6 {
background-color: #f5f3f3;
}
.col-md-4 {
border-radius: 15px 0 0 15px;
}
.col-md-2 {
border-radius: 0 15px 15px 0;
}
您可以根据内容修改样式中所需的 CSS 和大小。
希望这有助于...
关于html - Bootstrap 专栏全部内容背景色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29727995/