復(fù)制下來根本沒用，改了引用的鏈接的了，縮小屏幕會把右邊的導(dǎo)航往下擠
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>下拉菜單</title>
<link rel="stylesheet" >
<script src="https://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<style>
body{
padding:500px;
}
</style>
</head>
<body>
<!--代碼-->
<div class="navbar navbar-default" role="navigation">
? <div class="navbar-header">
? ? ? <!-- .navbar-toggle樣式用于toggle收縮的內(nèi)容，即nav-collapse collapse樣式所在元素 -->
? ? ? ?<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".navbar-responsive-collapse">
? ? ? ? ?<span class="sr-only">Toggle Navigation</span>
? ? ? ? ?<span class="icon-bar"></span>
? ? ? ? ?<span class="icon-bar"></span>
? ? ? ? ?<span class="icon-bar"></span>
? ? ? ?</button>
? ? ? ?<!-- 確保無論是寬屏還是窄屏，navbar-brand都顯示 -->
? ? ? ?<a href="##" class="navbar-brand">慕課網(wǎng)</a>
? </div>
? <!-- 屏幕寬度小于768px時，div.navbar-responsive-collapse容器里的內(nèi)容都會隱藏，顯示icon-bar圖標(biāo)，當(dāng)點擊icon-bar圖標(biāo)時，再展開。屏幕大于768px時，默認(rèn)顯示。 -->
? <div class="collapse navbar-collapse navbar-responsive-collapse">
? ? <ul class="nav navbar-nav">
? ? ? <li class="active"><a href="##">網(wǎng)站首頁</a></li>
? ? ? <li><a href="##">系列教程</a></li>
? ? ? <li><a href="##">名師介紹</a></li>
? ? ? <li><a href="##">成功案例</a></li>
? ? ? <li><a href="##">關(guān)于我們</a></li>
</ul>
? </div>
</div>
</body>?
</html>
2016-12-15
因為你的body 的css類型。padding：500px；這樣的上下左右間距都是500px了。