我正在使用 Ruby on Rails 3。我想使用 content_for? 方法呈现布局，以便“有条件地”生成具有适当 CSS 属性的 HTML 代码。也就是说，我想实现一个具有以下功能的布局：
content_for存在左列，则布局有2列（左列具有固定宽度，内容列具有剩余宽度）；
content_for 左列不存在，则布局有 1 列（内容列全宽）。如何在/app/views/layouts/application.html.erb 文件中实现它？你有什么建议吗？
注意：希望我正在寻找布局的示例实现（还包括 Ruby on Rails 方法、HTML 和 CSS 代码）。
奖励：在内容列块内我想“有条件地”显示一个右列如果content_for 右栏存在。
【问题讨论】：
标签： html css ruby-on-rails ruby-on-rails-3
您可以使用相邻的 (+) 或后续的 (~) 同级选择器，根据左列是否可见，有条件地对内容列应用边距。
对于你的额外问题，你应该将内容列的内容放在一个内层 div 中，然后使用:nth-last-child 检查右列是否可见并有条件地在那里应用边距：
CSS：
.page {
position: relative;
}
.page .left-column {
background: lavender;
left: 0;
position: absolute;
top: 0;
width: 180px;
}
.page .content-column { background: orange; }
.page .content-column > .inner-wrap { background: rgba(255,255,255,0.3); }
.page .left-column + .content-column {
margin-left: 200px;
}
.page .content-column .right-column {
background: lime;
position: absolute;
right: 0;
top: 0;
width: 90px;
}
.page .content-column > .inner-wrap:nth-last-child(2) {
margin-right: 100px;
}
HTML：
<div class="page">
<% if content_for?(:left_column) %>
<div class="left-column">
<%= yield(:left_column) %>
</div>
<% end %>
<div class="content-column">
<div class="inner-wrap">
<%= yield(:content_column) %>
</div>
<% if content_for?(:right_column) %>
<div class="right-column">
<%= yield(:right_column) %>
</div>
<% end %>
</div>
</div>
【讨论】：
+（或 ~）组合符，不需要在 if-else 中包含内容列的开始标签 - 您可以在 if-else 之外放置一个单独的开始标签，并依靠 CSS 来应用边距，如果有左列。我只使用 if-else 来展示如果您想为全宽/部分宽度提供不同的类，您可以做什么。尝试取出 jsbin 中的 full-width 和 partial-width 类，看看它仍然有效！
position: relative, position: absolute, left: 0, top: 0, ... 和 CSS 兄弟？ 是否可以简化 CSS 语句？ 例如，同样可以不使用“严格”兄弟，但使用 float 和类似属性来完成？
您可能想检查content_for?，如果给定参数产生了内容，它会返回true。见content_for?
【讨论】：
content_for? 方法。我正在寻找与 HTML 和 CSS 相关的“工作”代码。