Css 在 Rails 3.2 敏捷 Web 开发

Question

我必须使用 Rails 3.2 因为我的托管。但是，我安装了

gem "twitter-bootstrap-rails"

并且我还从 本书中复制了 css Rails 敏捷 Web 开发一书，第 4 版，Rails 3.2（实用程序员）- 2011 他们应用的布局。我把它放在这里：

C:\Bitnami\chiarini\app\assets\stylesheets

    /*
     * This is a manifest file that'll be compiled into application.css, which will include all the files
     * listed below.
     *
     * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
     * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
     *
     * You're free to add application-wide styles to this file and they'll appear at the top of the
     * compiled file, but it's generally better to create a new file per style scope.
     *
     *= require_self
     *= require fullcalendar
     *= require_tree .

    */

    #banner {
      background: #9c9;
      padding: 10px;
      border-bottom: 2px solid;
      font: small-caps 40px/40px "Times New Roman", serif;
      color: #282;
      text-align: center;

      img {
        float: left;
      }
    }

    #notice {
      color: #000 !important;
      border: 2px solid red;
      padding: 1em;
      margin-bottom: 2em;
      background-color: #f0f0f0;
      font: bold smaller sans-serif;
    }

    #columns {
      background: #141;

      #main {
        margin-left: 17em;
        padding: 1em;
        background: white;
      }

      #side {
        float: left;
        padding: 1em 2em;
        width: 13em;
        background: #141;

        ul {
          padding: 0;

          li {
            list-style: none;

            a {
              color: #bfb;
              font-size: small;
            }
          }
        }
      }
    }

我把我的布局视图：

C:\Bitnami\chiarini\app\views\layouts\application.html.erb

<!DOCTYPE html>
<html>
    <head>
      <title>aaa</title>
      <%= stylesheet_link_tag    "application", :media => "all" %>
      <%= javascript_include_tag "application" %>
      <%= csrf_meta_tags %>
    </head>
    <body class="<%= controller.controller_name %>">

        <div id="banner">
             <%= image_tag("logo.png") %>
             <%= @page_title || "aaa" %>
         </div>
         <div id="columns">
             <div id="side">
                <ul>
                 <li><a href="http://www....">Home</a></li>
                 <li><a href="http://www..../faq">Questions</a></li>
                 <li><a href="http://www..../news">News</a></li>
                 <li><a href="http://www..../contact">Contact</a></li>
                </ul>
             </div>
        </div>
         <div id="main">

            <% if notice %>
              <p class="alert alert-success"><%= notice %></p>
            <% end %>
            <% if alert %>
              <p class="alert alert-danger"><%= alert %></p>
            <% end %>

             <%= yield %>
         </div>
     </body>
 </html>

它是这样显示的：

应该是这样的：

不知道哪里出了问题。 bootstrap 是否有可能覆盖 css 的某些内容？

Answer 1

如果您使用 devise gem 进行身份验证和授权。请跳过 before_filter :authenticate_admin! 或 before_filter :authenticate_user! 作为您的根路径。

您还可以在app/views/devise/sessions/new.html.erb

中自定义您的登录（登录）模板

Css 在 Rails 3.2 敏捷 Web 开发

Css in Rails 3.2 Agile Web Development

css

ruby-on-rails

twitter-bootstrap

ruby-on-rails-3.2