未能在RoR Hartl教程中进行更改

时间:2013-09-26 17:35:03

标签: ruby-on-rails ruby

我刚刚开始Michael Hartl的Ruby on Rails教程的第5课:填写布局添加一些结构

我的更改从第3课开始就没有呈现。当我在任何页面(home.html.erb,about.html.erb等)中进行更改时,我没有任何问题。但登录和标题之类的东西不会改变。

application.html.erb

<!DOCTYPE html>
<html>
  <head>
    <title><%= full_title(yield(:title)) %></title>
    <%= stylesheet_link_tag "application", media: "all",
                                           "data-turbolinks-track" => true %>
    <%= javascript_include_tag "application", "data-turbolinks-track" => true %>
    <%= csrf_meta_tags %>
    <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
  </head>
  <body>
    <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>
    <section>
      <%= yield %>
    </section>
  </body>
</html>

的routes.rb

SampleApp::Application.routes.draw do
  get "pages/home"
  get "pages/contact"
  get "pages/about"
end

home.html.erb

<h1>Sample App</h1>
<p>This is the home page for the <a href="http://railstutorial.org">Ruby on Rails Tutorial</a> sample application.</p>

同样,我的页面只渲染它在第三章中所做的内容,没有样式表,导航栏没有变化,标题不正确(localhost:3000 / pages / home),而不是Ruby on Rails示例应用程序。

1 个答案:

答案 0 :(得分:0)

你正在使用的那些类navbar,navbar-fixed-top不存在css,这些是twitter bootstrap 2.3.2的一部分,它是css类和javascript函数的集合。因此,要使此代码生效,首先要在Railsproject / app / assets / stylesheets /目录中包含bootstrap.css文件。您可以在此处下载引导程序编译文件http://getbootstrap.com/2.3.2/ 注意:bootstrap.css位于bootstrap-2.3.2 / dist / css /目录中。只需复制该文件,一切都会正常工作。

你在application.html.erb语法中犯了错误。

不要使用标签来定义导航类,而是使用标签。 所以正确的语法是:

<nav 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>
</nav>

我认为应该解决这个问题。