在移动设备友好的界面中显示组合项目

Question

我目前正在开发我的作品集网站，并寻求有关优化我的个人项目展示的建议。目前，我已经实现了一个类似卡片的界面来展示我的项目，在桌面上看起来很棒。然而，在移动设备上，只有一张卡片可见，我正在探索增强移动观看体验的解决方案。

我考虑过使用专门针对移动设备的轮播/滑块。尽管如此，我担心这种方法可能会限制可见性，因为用户需要水平滑动卡片。这可能会导致某些项目被忽视。

对于如何在移动界面上有效地呈现多个项目卡而不影响可见性或用户体验，您有什么建议吗？

谢谢您的帮助！

https://maxbenen.github.io/MaxBenen/

[桌面版]()

尝试寻求建议。

Answer 1

在项目网格

行

也添加此代码

@media (max-width: 600px) {
            
            .project-grid {
                grid-template-columns: 1fr;
            }
        }