0

ここにHTMLがあります。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Title</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css">
<link href="css/bootstrap-responsive.css" rel="stylesheet" type="text/css">
<link href="css/style.css" rel="stylesheet" type="text/css">
<!-- HTML5 shim for IE backwards compatibility -->
<!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
</head>

<body>
<div class="container-fluid">
  <div class="row-fluid">
    <nav class="navbar navbar-inverse">
      <div class="navbar-inner"> <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> </a>
        <div class="nav-collapse">
          <ul class="nav">
            <li class="active"><a href="#">HOME</a> </li>
            <li><a href="#">ABOUT</a></li>
            <li><a href="#">WORK</a></li>
            <li><a href="#">RESUME</a></li>
            <li><a href="#">CONTACT</a></li>
          </ul>
        </div>
      </div>
    </nav>
  </div>
</div>
<div class="container-fluid">
  <div class="row-fluid">
    <div class="headline">
      <header class="span8">
        <h1>Headline goes here</h1>
      </header>
    </div>
  </div>
</div>
<script src="http://code.jquery.com/jquery-latest.js"></script> 
<script src="js/bootstrap.min.js"></script>
</body>
</html>

CSS では、配置の変更などは何もしていません。色や間隔などだけです。.navbar .nav > ul プロパティを display:box; に設定しています。それが影響している可能性はありますか？

さらに情報が必要な場合はお知らせください

これは、ブートストラップ ファイルのない jsfiddle です: http://jsfiddle.net/6PRhf

4

2 に答える 2

0

ページのナビゲーション バーを修正するには、次を使用します。

<div class="navbar navbar-inverse navbar-fixed-top">
...
</div>
于 2013-08-20T22:58:47.047 に答える