响应式网格布局导轨

Question

我有一个在视图中生成网格布局的 rails 应用程序。我让它从实例变量中切出 6 个项目并将它们添加到引导行 - 然后重复。我这样做的原因是因为在每一行内都有另一行，当单击一个项目时会显示另一行。

我现在想让它在手机上只显示 3 部电影，在笔记本电脑上只显示 6 部电影 - 但我认为唯一的方法是删除该行并使用引导列来定位项目 - 然后在下面动态创建一个 div单击的项目。这是正确的吗？

Answer 1

您不能只使用媒体查询在移动设备上隐藏其中的 3 个吗？你可以做类似的事情

@media (max-width: 480px) {
    .movie:nth-child(4),
    .movie:nth-child(5),
    .movie:nth-child(6) {
       display: none;
    }
}