html - 使用 Jekyll 和 Bootstrap -build、-serve 后 CSS 未反射(reflect)在本地主机页面中

标签 html css jekyll jekyll-bootstrap

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

我正处于以粗体主题行“液体模板系统”开头的步骤。

问题是我的网站没有反射(reflect) CSS。

在教程代码中,他引用了 ,但是在 www.getbootstrap.com 的 Bootstrap-3.2.0-dist 中,不再有 bootstrap-responsive.css。只有以下几种:

  • bootstrap-theme.css
  • bootstrap-theme.min.css
  • bootstrap.min.css
  • bootstrap.css

我的代码如下;我循环引用了列出的所有四个 css 文件,当我 jekyll build 然后 jekyll serve 时,它​​们没有反射(reflect)出来。目前我在这个开发过程中只是本地托管,完成后我会推送到我的网站。我的 _site 目录中有 css 目录,这也是我的 index.html 文件所在的位置。

有没有人有过使用 Jekyll 不反射(reflect) 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>

最佳答案

OP 指的是 Bootstrap 2。最新版本 3 没有针对响应元素的单独文件,因为它假设从一开始就具有响应能力。如果您只想跟随教程,那么您可以下载 Bootstrap 2 here .

进一步:

I have the css directory in my _site directory, which is also where my index.html file is located.

_site 目录是 localhost 的 ServerRoot 吗?如果不是,请删除 link 属性中的初始正斜杠,因为它当前指向您的 ServerRoot。

关于html - 使用 Jekyll 和 Bootstrap -build、-serve 后 CSS 未反射(reflect)在本地主机页面中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24479191/

相关文章:

css - 同一组件的 MVC 不同 CSS 属性

ruby - 我如何在 Jekyll 项目中包含 font-awesome-sass gem

jekyll - 列出杰基尔的所有收藏

javascript - 如何保存自动生成的 "div id "。我正在尝试保存用户滚动时在屏幕上可见的 div id

javascript - 如何删除表单中的按钮格式以便将按钮用作切换按钮?

html - CSS:内容区域必须占据 100% 的高度

ruby - macOS 无法安装 Jekyll Gem

html - 使用 bootstrap 4 flexbox 垂直对齐多行

javascript - 我想知道 WebKitCSSMatrix 是如何工作的

html - slider 上的响应式图像按钮