昵称sama
2017-09-26 22:29
<!--自适应布局--> <div class="container-fluid"> <div class="row"> <!--左侧导航栏--> <div class="col-sm-3 col-md-2 sidebar"> <ul class="nav nav-sidebar"> <li class="active"><a href="#">首页</a></li> </ul> <ul class="nav nav-sidebar"> <li><a href="#">信息建立</a></li> <li><a href="#">信息查询</a></li> <li><a href="#">信息管理</a></li> </ul> <ul class="nav nav-sidebar"> <li><a href="#">设置</a></li> <li><a href="#">帮助</a></li> </ul> </div> <!--右侧管理控制台--> <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main"> <h1 class="page-header">管理控制台</h1>
这两块地方在同一行里啊 我看到最下面row才闭合的
怎么把col-md-offset-2 删掉右边的还往右移了 加上了却恢复到紧贴左边的状态 不太明白
把右侧的col-md-10 改成 col-md-12却占据了整行 不像是与左侧在一行的样子
orz不明白
不知道在一个class中同时写.col-sm-9和.col-md-10是啥意思,我的理解是Bootstrap的栅格是12列的,你出现的问题应该是没把右侧管理控制台代码也放到row里去,以下是修正过的代码,试过之后可以出现在同一行:
<div class="container-fluid">
<div class="row">
<!--左侧导航栏-->
<div class="col-md-2 sidebar">
<ul class="nav nav-sidebar">
<li class="active"><a href="#">首页</a></li>
</ul>
<ul class="nav nav-sidebar">
<li><a href="#">信息建立</a></li>
<li><a href="#">信息查询</a></li>
<li><a href="#">信息管理</a></li>
</ul>
<ul class="nav nav-sidebar">
<li><a href="#">设置</a></li>
<li><a href="#">帮助</a></li>
</ul>
</div>
<!--右侧管理控制台-->
<div class="col-md-9">
<h1 class="page-header">管理控制台</h1>
</div>
</div><!--.row的闭合标签-->
</div><!--最外层.container-fluid的闭合标签-->
希望能帮到你吧
基于bootstrap的网页开发
187668 学习 · 734 问题
相似问题