我想在 Rails 中显示电子商务页面的项目,而不是标准的垂直列表,我想从左到右显示标题和图像,大约 4 个,然后继续添加列表:即.
条目 1 条目 2 条目 3 条目 4
条目 5 条目 6 ....
我的第一个猜测是为每一列创建一个范围——我可以将条目跳过 4 倍,但我想知道是否有使用 CSS 或任何其他技巧的更好解决方案?
我想在 Rails 中显示电子商务页面的项目,而不是标准的垂直列表,我想从左到右显示标题和图像,大约 4 个,然后继续添加列表:即.
条目 1 条目 2 条目 3 条目 4
条目 5 条目 6 ....
我的第一个猜测是为每一列创建一个范围——我可以将条目跳过 4 倍,但我想知道是否有使用 CSS 或任何其他技巧的更好解决方案?
Enumerable 上有一个方法叫做each_slice
. 基本上它所做的是给你一个数组的切片。
(1..10).each_slice(3) {|a| p a}
# outputs below
[1, 2, 3]
[4, 5, 6]
[7, 8, 9]
[10]
使用 CSS 的另一种选择是拥有一个固定宽度的容器,比如 400px,然后让每个元素都有width: 100px
and float: left
,这样它们就会一个接一个地排列。