修复了sidenav和nav bootstrap

时间:2016-10-25 09:53:55

标签: twitter-bootstrap nav

我需要创造 next view

但使用固定导航和sidenav使用bootstrap。

你能帮我解决这个问题吗?

1 个答案:

答案 0 :(得分:0)



<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>



<style>
.sidebar{
	height: 500px;
	border: thin black solid;
	
}

.nav_menu{
	border: thin red solid;
}

.content{
	border: thin green solid;
	height: 430px;
}



</style>



<div class="row">
<div class="col-md-3 sidebar">
	Your side bar content
</div>
<div class="col-md-9">
	<div class="row">
		<div class="col-md-12">
		<nav class="navbar navbar-default nav_menu">
		  <div class="container-fluid">
		    <ul class="nav navbar-nav">
		      <li class="active"><a href="#">Home</a></li>
		      <li><a href="#">Page 1</a></li>
		      <li><a href="#">Page 2</a></li>
		      <li><a href="#">Page 3</a></li>
		    </ul>
		  </div>
		</nav>
		</div>
	</div>

	<div class="row" style="margin:0;">
		<div class="col-md-12 content">
			Your Content
		</div>
	</div>
</div>

</div>
&#13;
&#13;
&#13;

这和你想要的一样吗?