0

首先让我说我已经对此进行了研究，并且没有一个答案对我有帮助。我一定是做错了什么，我只是不知道是什么。正如你所看到的，我已经尝试了我也在这里找到的 body CSS，但这仍然不起作用。我查找了一个站点并使用了他们的代码，该代码将我的内容直接放在导航栏下方而不是在导航栏下方，但我仍然希望两者之间有一些空间。

<!DOCTYPE html>
<html>
<head>
<title>siteName || Welcome!</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">

<!-- JavaScript plugins (requires jQuery) -->
<script src="http://code.jquery.com/jquery.js"></script>

<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>

<!-- Optionally enable responsive features in IE8 -->
<script src="js/respond.js"></script>

body {
    padding-top: 60px;
    padding-bottom: 80px;
}
.sidebar-nav {
    padding: 9px 0;
}
@media(max-width: 980px) {
/* Enable use of floated navbar text */
.navbar-text.pull-right {
      float: none;
      padding-left: 5px;
      padding-right: 5px;
}
}
</style>
</head>
<body>
<div class="row">
<div class="navbar navbar-fixed-top navbar-inverse">
    <div class="navbar-inner">
    <div class="container">
    <a class="brand" href="#">siteName</a>
        <ul class="nav navbar-nav">
            <li><a href="#">About Me</a></li>
            <li><a href="#">Contact Me</a></li>
            <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Links<span class="caret"></span></a>
                <ul class="dropdown-menu">
                    <li><a href="#">site1</a></li>
                    <li><a href="#">site2</a></li>
                    <li><a href="#">site3</a></li>
                </ul>
            </li>
        </ul>
        <button type="button" class="btn btn-inverse navbar-btn pull-right">Sign in</button>
        <form class="navbar-search pull-right"><input type="text" class="search-query" placeholder="Search"></form>

    </div>
    </div>
</div>
</div>
<div class="container-fluid">
    <div class="row-fluid">
        <div class="span9 well">
            <div class="jumbotron">
                <h1>Hello World</h1>
                <p>Welcome, this isn't lowering down at all :c</p>
            </div>
        </div>
    </div>
</div>
</body>
</html>
4

1 回答 1

0

看起来你忘记了你的风格代码。

我只是从该部分中提取了一个快速示例来添加代码：

    <script src="js/respond.js"></script>

这里应该有一个

    <style>

标签将意味着这是一些样式的开始。

    body {
        padding-top: 60px;
        padding-bottom: 80px;

然后，当然，我看到您在这里已经有了 style 的结束标记：

    padding-left: 5px;
    padding-right: 5px;
    }
    }
    </style>

希望这些提示对您有所帮助！

于 2014-04-13T00:37:00.833 回答