Ruby on rails rails中不同页面的不同背景色_Ruby On Rails_Css_Background_Styling

Ruby on rails rails中不同页面的不同背景色

ruby-on-rails css

Ruby on rails rails中不同页面的不同背景色,ruby-on-rails,css,background,styling,Ruby On Rails,Css,Background,Styling,所以我使用的是application.html.erb文件，它基本上是我网站中每个页面的布局。但是我希望主页有一个白色的背景，其余的页面有一个不同的背景。问题是，如果我将整个主页文件包装在一个div中，它只包装“yield”位置，因此它显示为一个带有白色背景的框，在一个带有灰色背景的较大框中显示。那么，我怎样才能改变主页的整个背景，而留下其余的呢谢谢考虑在主页的body标签（或者主包装器）上放置一个特殊的类，然后在CSS中这样做。因此，您可以在主页上显示： <body class="h

所以我使用的是application.html.erb文件，它基本上是我网站中每个页面的布局。但是我希望主页有一个白色的背景，其余的页面有一个不同的背景。问题是，如果我将整个主页文件包装在一个div中，它只包装“yield”位置，因此它显示为一个带有白色背景的框，在一个带有灰色背景的较大框中显示。那么，我怎样才能改变主页的整个背景，而留下其余的呢

谢谢

考虑在主页的body标签（或者主包装器）上放置一个特殊的类，然后在CSS中这样做。因此，您可以在主页上显示：

<body class="homepage">
  <p>hi!</p>
</body>

更新：您可以使用这样的帮助器使生活更轻松：

def body_class
  @body_class || ''
end

然后在您的主页视图中，在顶部放置如下内容：

<% @body_class = "homepage" %>

很明显，这取决于你的应用程序的具体情况，但对我来说效果很好。

进一步介绍@muffinista提供的答案：您可以使用控制器中设置的实例变量来确定何时将“homepage”类放在body标记上。因此：

def index
  @home_page = true
  # existing code
end

在布局中：

<body class="<%= @home_page ? 'homepage' : ''%>">
 <%= yield %>
</body>

如果您需要为多个页面设置不同的背景，那么将用于查找适当背景的代码移动到一个部分中是有意义的，并且增加了可读性：

_background.html.erb：

    <%- if @main_page_background OR @stylish_background %>
       "main_page_background"
      <%- elsif @dark_background %>   
        "dark_page_background"
      <%- else %>  
        ""  
    <% end %>


“主页面背景”
“深色页面背景”
""

问题是，主页没有正文。主页中的所有HTML都作为模板application.HTML.erb的收益，该模板只有一个正文…我可以在正文中包含正文吗？您还可以使用

content\u for

在头部添加javascript，以更改正文的类别，如果您想在视图中修改它的话。（在不修改布局的情况下修改布局的通用方法）@NosayrYassin我刚刚在我的答案中添加了一些细节，说明了我是如何做到这一点的——简言之，有一个助手可以让您更轻松地完成这项工作。这通常也是人们设置页面标题等的方式。我应该在主页后面放什么

？@evan在答案中，如果它不是主页，则不在那里放置任何内容（因此为空字符串）。如果您想为所有其他页面使用其他类，则该类可以转到那里。你不应该把样式信息放在那里，因为样式应该放在样式表中，而且代码的这一部分是专门用来添加类的。@Thewalrus先生编辑我删除的帖子：

home

在做什么，为什么

black

不能作为类使用<代码>@evan

home

是一个类

@home

是一个实例变量。假设“black”是一个类，我认为您的代码没有任何错误。也许你应该就你的具体情况提出一个新问题——这似乎超出了评论的范围。

<body class="<%= @home_page ? 'homepage' : ''%>">
 <%= yield %>
</body>

    <%- if @main_page_background OR @stylish_background %>
       "main_page_background"
      <%- elsif @dark_background %>   
        "dark_page_background"
      <%- else %>  
        ""  
    <% end %>