0

我想在我的网站主页上的主 div 中添加一个包装器。我还没有购买 ssl 证书。

我正在使用引导程序，这个 div 有容器类。我想将它包装在一个 div 中以提供背景，类似于这个twillio 网站。

这是一个简单的 css 操作（或者我认为），所以我确定我在 rails/bootstrap 方面遗漏了一些东西。根据 Rails 约定，我使用了几种布局，经过大约 3 个小时的尝试来解决这个问题，我担心在这里遗漏了一些更深层次的东西。感谢您对此的帮助。

<div class="center hero-unit" id="homegreen">
<h1>54footy</h1>
<iframe width="550" height="315" src="http://www.youtube.com/embed/1hQmlFzqJyo" frameborder="0" allowfullscreen></iframe>
<p>Your Heroes here -54footy</p>    
<%= link_to "Pick your Hero", signup_path, class: "btn btn-large btn-primary" %>    
<input type="text" data-provide="typeahead" data-source="["Option 1","Option 2","Option 3"]">
</div>

应用程序.html.erb

<!DOCTYPE html>
<html>
 <head>
  <title><%= full_title(yield(:title)) %></title>
  <%= stylesheet_link_tag    "application", :media => "all" %>
  <%= javascript_include_tag "application" %>
  <%= csrf_meta_tags %>
  <%= render 'layouts/shim' %>
 </head>
 <body>
   <%= render 'layouts/header' %>
   <div class="container">
    <% flash.each do |key, value| %>
     <%= content_tag(:div, value, class: "alert alert-#{key}") %>
    <% end %>
    <%= yield %>
    <%= render 'layouts/footer' %>
    <%= debug(params) if Rails.env.development? %>
   </div>
 </body>
</html>

当我尝试为背景插入一个 div 时，它就像容器一样居中，我本质上希望它拉伸页面的整个长度，并让 div 现在在背景中居中内容。与我列为参考的 twillion 站点非常相似。

4

2 回答 2

0

我看到的第一件事是你没有关闭它

<div class="center hero-unit" id="homegreen">

尝试</div>在最后添加一个...：D

于 2012-08-25T22:29:10.173 回答
0

在我的静态页面控制器中，我添加了

render :layout => false

然后，我复制了我的应用程序布局并将其放在我的主视图中。从那里我能够以我以前无法做到的方式操纵家庭 css。基本上将问题中的上述代码添加到问题中的后一个代码中。 

 <!DOCTYPE html>
 <html>
  <head>
   <title><%= full_title(yield(:title)) %></title>
   <%= stylesheet_link_tag    "application", :media => "all" %>
   <%= javascript_include_tag "application" %>
   <%= csrf_meta_tags %>
   <%= render 'layouts/shim' %>
  </head>
  <body>
    <%= render 'layouts/header' %>
     <div id="wrapper" style="height:600px; background-color:red;">
      <div class="container">
    <% flash.each do |key, value| %>
      <%= content_tag(:div, value, class: "alert alert-#{key}") %>
    <% end %>
        <div>
          <span id="home_pic">
            <img src="http://placehold.it/550x315">
          </span>
        </div>
       </div>
     </div>
   <div class="container">
      <%= render 'layouts/footer' %>
     <%= debug(params) if Rails.env.development? %>
   </div>   
  </body>
 </html>

这一点没有什么干的。其他任何人都想到了更好的方法来做到这一点，我很肯定这只是我的解决方案。谢谢。

于 2012-08-26T23:21:39.893 回答