Question

我正在组建一个来自One Month Rails的基本网站，似乎无法弄清楚如何让导航栏显示在顶部。我花了几个小时想去社区。这是来自_header.html.erb的代码（使用bootstrap sass）

<div class="navbar navbar">
    <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="#">Project name</a>

                <div class="nav-collapse collapse">
                    <ul class="nav">
                        <li>
                            <%= link_to 'Home',  root_path %>
                        </li>
                        <li>    
                            <%= link_to 'About',  about_path %>
                        </li>
                    </ul>
                    <ul class="nav pull-right">
                                <li><%= link_to 'Login',  '#' %></li>
                    </ul>
                </div>
        </div>
    </div>
</div>

以下是application.html.erb标签中的代码：

<!DOCTYPE html>
<html>
    <head>
        <body>
          <title>One Month Rails</title>
          <%= stylesheet_link_tag    "application", :media => "all" %>
          <%= javascript_include_tag "application" %>
          <%= csrf_meta_tags %>
        <%= tag :meta, name: "viewport", content: "width=device-width, initial-scale=1.0" %>
        </head>
        <body>
        <%= render 'layouts/header' %>
        <div class="container">
        <%= yield %>
        <%= render 'layouts/footer' %>
    </div>
    </body>
</html>

Answer 1

您似乎在application.html.erb中有一些HTML错误。但是大多数现代浏览器会在加载页面时为您修复这些错误。这是一个更好的版本：

<!DOCTYPE html>
<html>
    <head>
        <title>One Month Rails</title>
        <%= stylesheet_link_tag    "application", :media => "all" %>
        <%= javascript_include_tag "application" %>
        <%= csrf_meta_tags %>
        <%= tag :meta, name: "viewport", content: "width=device-width, initial-scale=1.0" %>
    </head>
    <body>
        <%= render 'layouts/header' %>
        <div class="container">
            <%= yield %>
            <%= render 'layouts/footer' %>
        </div>
    </body>
</html>

您还应该确保_header.html.erb位于app/views/layouts/。

最后，不要忘记将bootstrap的css文件添加到app/assets/stylesheets/。

Navbar没有出现在Rails网站上

1 个答案: