css - 无法连接 Bootstrap 样式表

标签 css twitter-bootstrap

我会简明扼要,因为我相信可以快速解决我当前的问题。我正在使用一个空白模板使用 Bootstrap ,但由于某种原因我无法连接我的样式表?所有文件都位于同一目录中。由于不必要的挫折,我的耐心逐渐消退。如果您有任何答案或建议,我们将不胜感激:)。我已经在下面发布了 HTML,谢谢!

贾斯汀

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Justin A Henderson</title>

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

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
      <!---jumbotron--->
   <div class="jumbotron">
    <div class="container">
        <h1>Justin Henderson</h1>
    </div>
   </div>


    <!--nav-->
<ul class="nav nav-pills">
  <li role="presentation" class="active"><a href="#">Home</a></li>
  <li role="presentation"><a href="#">Profile</a></li>
  <li role="presentation"><a href="#">Messages</a></li>
</ul>


    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>

最佳答案

假设您的 HTML 文件名为 justin.html,它位于名为 site 的文件夹中:

site
|
+-- justin.html

您的 bootstrap CSS 文件显示为 ..\css\bootstrap.css,其中表示:上一层,进入 CSS 文件夹,并获取 bootstrap.css,这意味着您需要以下目录结构才能正常工作:

<parent folder>
|
+-- css
|   |
+   +-- bootstrap.css
|
+-- site
    |
    +-- justin.html

但我敢打赌你的 css 文件夹实际上是 inside site,还有你的 js 文件夹,例如:

site
|
+-- css
|   |
|   +-- bootstrap.css
|
+-- js
|   |
|   +-- bootstrap.min.js
|
+-- justin.html

正确的路径应该是:

<link href="css/bootstrap.css" rel="stylesheet">

关于css - 无法连接 Bootstrap 样式表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31119495/

相关文章:

html - 无法在 Bootstrap 导航中垂直居中非 anchor 标签

css - <body> background-color 属性不能与 HTML5 DOCTYPE 一起正常工作

html - <ul> 位置没有像我希望的那样工作

java - 如何用引号在 Thymeleaf 问题中添加 <i class ="something"></i>

javascript - iOS 7 使用 CSS 的模糊叠加效果?

javascript - Laravel 和 Vue : where to put js/app. js?

javascript - JS 如何检测 HTML 中的变化,例如 ctrl+shift+i 输入?

javascript - Bootstrap Popover - 显示在底部

css - 如何使用bootstrap显示左边的图像和右边的内容

html - Bootstrap 中的相等 div 和 100% 高度