5

Fluid レイアウトのTwitter Bootstrap Scaffoldingセクションには、2 つの青いボックスとして表示されるコード例が示されています。その例を使用すると、以下のコードは「Sidebar content Body content」を表示しますが、ボックスは表示しません。他に何が必要ですか？

<!DOCTYPE html>
<html>
<head>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.no-iconhttp://twitter.github.io/bootstrap/scaffolding.htmls.min.css" rel="stylesheet">
</head>
<body>
<div class="container-fluid">
  <div class="row-fluid">
    <div class="span2">
      Sidebar content
    </div>
    <div class="span10">
      Body content
    </div>
  </div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
</body>
</html>
4

2 に答える 2

6

青いボックスを見ようとしている場合は、参照用に表示されているだけで、グリッドがどのように分割されているかを示しています。これらは、実際にはコードに含めることを意図したものではありません。Sidebar Content と Body Content という単語は、コンテンツが表示される場所の参照ポイントです。シェーディングを取得するには、span2 および span10 div の横に CSS クラスを追加する必要があります。次に例を示します。

<div class="span2 well">
  Sidebar content
</div>
于 2013-07-20T22:57:24.670 に答える