为什么Bootstrap不将div放在一起?

时间:2013-10-14 16:37:25

标签: css asp.net-mvc-4 twitter-bootstrap

我是一个带有以下index.cshtml的MVC4项目:

@{
    Layout = null;
}
<script src="~/Scripts/jquery-2.0.3.js"></script>
<script src="~/Scripts/bootstrap.js"></script>
<link href="~/Content/bootstrap/bootstrap.css" rel="stylesheet" />
<link href="~/Content/bootstrap/bootstrap-theme.css" rel="stylesheet" />

<div class="well">Hmm..</div>

<div class="container">
    <div class="navbar">
      <div class="navbar-inner">
        <a class="brand" href="#">Title</a>
        <ul class="nav">
          <li class="active"><a href="#">Home</a></li>
          <li><a href="#">Link</a></li>
          <li><a href="#">Link</a></li>
        </ul>
      </div>
    </div>
</div>

<div class="row-fluid">
    <div class="span8">left</div>
    <div class="span4">right</div>
</div>

输出似乎工作减半,因为带有井的div获得了很好的背景颜色。但导航栏将所有div放在彼此之下而不是彼此相邻:

Title
  Home
  Link
  Link

这也适用于行。看起来像这样:

Left
Right

有人知道这里发生了什么吗?

1 个答案:

答案 0 :(得分:2)

我认为你必须为分区申请span

<div class="span4">
  <p>Bruce Wayne</p>
 ...
</div>

自从我使用Bootstrap以来已经有一段时间了但是我只是快速看了一下它似乎现在大概叫做col。您可以在此处进一步查看link