軌道中不同頁面的不同背景顏色

所以我使用了一個application.html.erb文件，它基本上是我網站中每個頁面的佈局。但我希望主頁有白色背景，其餘頁面有不同的背景。問題是，如果我將整個主頁文件封裝在一個div中，它只會包裝「yield」的地方，所以它顯示爲一個帶有灰色背景的大框中帶有白色背景的框。那麼，我該如何改變整個網頁的背景，並留下餘下的內容呢？軌道中不同頁面的不同背景顏色

謝謝！

來源

2012-01-16 Nosayr Yassin

對@muffinista提供的答案進行擴展：您可以使用控制器中設置的實例變量來確定何時將「主頁」類放在body標籤上。所以：

def index 
    @home_page = true 
    # existing code 
end

，並在佈局：

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

來源

2012-01-16 16:24:41 MrTheWalrus

解決！多謝你們！ – 2012-01-16 16:36:49

在主頁之後放什麼？ '」>'？ – evan 2014-03-12 22:40:38

@evan在答案中，如果它不是主頁，則不要在其中放置任何內容（因此爲空字符串）。如果您想爲其他所有網頁使用其他課程，則該課程可以到達那裏。你不應該在那裏放置樣式信息，因爲樣式應該在樣式表中，並且因爲那部分代碼專門用於添加類。 – MrTheWalrus 2014-03-13 02:12:21

考慮在您的主頁的body標籤（或者您的主包裝）上放一個特殊的類，然後在CSS中做。所以，你可以有自己的主頁：

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

然後在其他網頁：

<body> 
    <p>i am not a homepage!</p> 
</body>

而在你的CSS：

body { 
// some general css 
} 

body.homepage { 
// some css for homepage elements 
background-color: #000000; 
}

UPDATE：你可以用這樣一個幫手這使生活更輕鬆：

def body_class 
    @body_class || '' 
end

然後在你的主頁的意見，把頂部是這樣的：

<% @body_class = "homepage" %>

顯然，這取決於你的應用程序的細節，但對我來說工作正常。

來源

2012-01-16 16:18:46 muffinista

問題是，網頁沒有正文。從主頁上的所有HTML都可以作爲yield的模板application.html.erb，它只有一個主體...我可以在一個主體內有一個主體嗎？ – 2012-01-16 16:23:40

如果你想在視圖中修改它，你也可以使用'content_for'在頭部添加javascript來改變正文的類。（通用的方式來修改佈局，而不修改佈局） – alternative 2012-01-16 16:49:44

@NosayrYassin我只是在我的答案中添加了一些細節，以便我如何做到這一點 - 簡而言之，有一個幫助器可以讓你更輕鬆地完成這項工作。這通常是人們設置頁面標題等的方式。 – muffinista 2012-01-16 17:17:42

只需添加到接受的答案，如果你需要爲多個頁面設置不同的背景，它將使感並增加可讀性移動用於查找適當的背景成部分碼：

<body class= <%=render partial: "layouts/background" %> >

_background.html.erb：

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

來源

2015-09-14 10:04:11 wondersz1

軌道中不同頁面的不同背景顏色

回答

相關問題