Question

我一直关注这里的教程 - ＆gt; https://www.andrewmunsell.com/tutorials/jekyll-by-example/tutorial建立我的第一个网站，学习Jekyll和Bootstrap。我是CSS的新手，也是HTML的初学者。

我正处于以大胆的主题行“Liquid Template System”开头的步骤。

问题是我的网站没有反映CSS。

在教程代码中，他引用了，但是在www.getbootstrap.com的Bootstrap-3.2.0-dist中，不再有bootstrap-responsive.css。只有以下内容：

自举-theme.css
自举-theme.min.css
bootstrap.min.css
bootstrap.css

我的代码如下;我通过引用列出的所有四个css文件循环，当我jekyll构建然后jekyll服务时它们没有反映出来。目前我只是在这个开发过程中的本地托管，一旦完成，我将推送到我的网站。我的_site目录中有css目录，这也是我的index.html文件所在的目录。

任何人都有使用Jekyll的经验而不反映Bootstrap中的CSS更改？

根据StackOverflow上的其他搜索，我尝试清除缓存，重建和服务，没有任何乐趣。建议在此欣赏。谢谢。

<!DOCTYPE html>     
<html lang="en">
<head>
<meta charset="utf-8">
<title>{{ site.name }}</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="{{ site.description }}">
<link href="/css/bootstrap.css" rel="stylesheet">
<style>
body {
padding-top: 60px;
}
</style>
<link href="/css/bootstrap.css" rel="stylesheet">

<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

<div class="navbar-inner">
<div class="container">
  <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>
  </a>
  <a class="brand" href="#">{{ site.name }}</a>
  <div class="nav-collapse collapse">
    <ul class="nav">
      <li class="active"><a href="/">Home</a></li>
    </ul>
   </div>
  </div>
 </div>
</div>

<div class="container">

 {{ content }}

</div>

Answer 1

OP指的是Bootstrap 2 。最新版本 3 没有针对响应元素的单独文件，因为假定来自关闭的响应。如果您只想按照教程进行操作，则可以下载Bootstrap 2 here。

此外：

我的_site目录中有css目录，这也是我的index.html文件所在的目录。

您的_site目录是否为localhost的ServerRoot？如果没有，请从link属性中删除初始正斜杠，因为它当前指向您的ServerRoot。

使用Jekyll和Bootstrap后，CSS在-build，-serve之后没有反映在localhost页面中

1 个答案: