Question

我正在浏览Michael Hartl的教程，并且已经达到了样式和布局章节，似乎有些不对劲。在本教程中，站点链接在一行上正确对齐（如此http://railstutorial.org/images/figures/site_with_footer_bootstrap_4_0-full.png），我将它们正确地对齐在另一行之下，并且一些（但不是全部）其他样式元素丢失。

我尝试过更新宝石。

示例代码 - _header.html.erb

<header class="navbar navbar-fixed-top navbar-inverse">
  <div class="navbar-inner">
<div class="container">
  <%= link_to "sample app", '#', id: "logo" %>
  <nav>
    <ul class="nav pull-right">
      <li><%= link_to "Home",    '#' %></li>
      <li><%= link_to "Help",    '#' %></li>
      <li><%= link_to "Sign in", '#' %></li>
    </ul>
  </nav>
</div>

我认为这意味着引导程序对某些内容不满意，但我不能说出什么。

感谢您阅读此内容：）

Answer 1

假设您的所有HTML都是导航栏，那么标签看起来并没有正确关闭。尝试：

<header class="navbar navbar-fixed-top navbar-inverse">
  <div class="navbar-inner">
    <div class="container">
      <%= link_to "sample app", '#', id: "logo" %>
      <nav>
        <ul class="nav pull-right">
          <li><%= link_to "Home",    '#' %></li>
          <li><%= link_to "Help",    '#' %></li>
          <li><%= link_to "Sign in", '#' %></li>
        </ul>
      </nav>
    </div>
  </div>
</header>

Answer 2

如果您对代码与应有的代码有任何疑问，请先尝试检查其资源库。

https://github.com/railstutorial/sample_app_rails_4

他有一份示例应用程序的完整工作副本。

Answer 3

进一步深入研究RADan的评论

奇怪的是，gem list --local给出了 - bootstrap-sass（3.1.1.0,2.3.2.0）

我发现我遇到了同样的问题。要解决这个问题（它提供较新版本的bootstrap而不是旧版本 - 导致CSS类问题）我通过在终端中输入以下内容来删除旧版本的bootstrap：

gem uninstall bootstrap-sass -v 3.1.1.0

ruby on rails教程第五章 - 造型

3 个答案: