格栅布局怎样让整个body分为两列,例如左侧背景为灰色
<div class="container-fluid"> <div class="row"> <div class="col-xs-2">左边列</div> <div class="col-xs-10">右边列</div> </div> </div>
左侧背景为灰色且高度充满,我使用的是在<div class="col-xs-2">左边列</div>中追加一个自己取的类left-nav,得到<div class="col-xs-2 left-nav">左边列</div>
,然后再写样式覆盖。
.left-nav{
height: 760px;
background-color: #ddd;
padding: 0;
}高度给了一个固定值,不知道还有没有别的办法哦。
<style>
.left{width:200px;height:100%;float:left;background:gray;}
.right{width:200px;height:500px;float:left;}
</style>
<div class="left">左列</div>
<div class="right>右列</div>