下拉框在GitHub上出现错误使用Jekyll构建的页面

Question

使用Jekyll构建的我的GitHub Pages网站在推送到GitHub时没有正确显示我的导航栏。当使用本地制造“杰基尔服务”功能正常，如下所示：

然而，当推到GitHub上的标题是不可见的，似乎链接显示上方的下拉框：

本地我有Jekyll 3.4.3这是在github上列出的相同，以前我的网站正常显示（本地相同的在线），但几个月后，我似乎无法让它正确显示再次。我对Jekyll不是很有经验，因为这是我的第一个实验，但我确实有一些其他的Web开发经验。

任何意见将不胜感激。

navbar.html

<div class="navbar navbar-fixed-top"> 
<div class="navbar-inner"> 
    <div class="container-fluid"> 
     <button type="button" 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> 
     </button> 
<!--   <form class="navbar-search pull-right" 
action="http://google.com/search" method="get"> 
{% if site.safe %} 
      <input type="hidden" name="q" value="site:{{ site.url | remove_first:'http://' }}"> 
{% else %} 
      <input type="hidden" name="q" value="site:{{ site.url | domain_name }}"> 
{% endif %} 
      <input type="text" name="q" class="input-medium search-query" placeholder="Search"> 
     </form> --> 
     <div class="nav-collapse collapse"> 
      <ul class="nav"> 
{% for node in site.navbar_list %} 
{% if node.name == page.group %}{% assign active = 'active' %} 
{% else %}{% assign active = nil %}{% endif %} 
{% if node.dropdown %} 
       <li class="dropdown dropdown-container {{ active }}"> 
        <a class="dropdown-link" href="{{ site.baseurl }}{{ node.link }}">{{ node.name }}</a> 
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">{{ node.name }}<b class="caret"></b></a> 
        <ul class="dropdown-menu"> 
    {% for sub in node.dropdown %} 
         <li><a href="{{ site.baseurl }}{{ sub.link }}">{{ sub.name }}</a></li> 
    {% endfor %} 
        </ul> 
       </li> 
{% else %} 
       <li class="{{ active }}"> 
        <a href="{{ site.baseurl }}{{ node.link }}">{{ node.name }}</a> 
       </li> 
{% endif %} 
{% endfor %} 
      </ul> 
     </div><!--/.nav-collapse --> 
    </div> 
</div> 

的style.css

/* title of the site */ 
#header { 
    height: 80px; 
} 
#header hgroup { 
    position: absolute; 
    top: 10px; 
    left: 20px; 
} 
#header h1 { 
    margin: 0; 
    font-size: 1.75em; 
    font-weight: bold; 
} 
#header h2 { 
    color: #ccc; 
    margin: 0 0 4px 16px; 
    line-height: 0.8; 
    font-size: 1.0em; 
    font-weight: normal; 
} 
#header a, 
#header a:hover, 
#header a:visited { 
    text-decoration: none; 
} 

/* header.html: navbar */ 
.navbar-fixed-top { 
    margin-bottom: 20px; 
    position: static; 
} 
.navbar-fixed-top .navbar-inner { 
    padding: 0; 
    border-top: 1px solid #d4d4d4; 
    border-bottom: 1px solid #d4d4d4; 
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.067); 
} 
.navbar .nav > .active > a, 
.navbar .nav > .active > a:hover, 
.navbar .nav > .active > a:focus { 
    box-shadow: none; 
} 
.navbar .btn-navbar { 
    margin-bottom: 5px; 
} 
.lt-ie9 .collapse { 
    overflow: visible; /* removed from 2.1.1, but still IE need this */ 
} 

/* header.html: dropdown container */ 
.navbar .nav > li.dropdown-container { 
    position: relative !important; 
} 
.navbar .nav > li.dropdown-container .dropdown-link { 
    position: absolute !important; 
    top: 0; 
    left: 0; 
    z-index: 1; 
} 
.navbar .nav > li.dropdown-container .caret { 
    margin-left: 1.5em; 
} 
.navbar .nav > li.dropdown-container .dropdown-link + .dropdown-toggle { 
    z-index: 0; 
} 

Answer 1

解决你的问题，你需要从_includes\cssstyle.css文件复制到assets\css，重命名为site.css（因为你已经有style.css在assets\css文件夹中），那么你必须添加链接到_includes\head.html如下：

{% endcase %} 
<link rel="stylesheet" href="{{ site.baseurl }}/assets/css/site.css"> 
<link rel="stylesheet" href="{{ site.baseurl }}/assets/css/style.css"> 

<!-- Font Awesome -->