我有一个WWW网站项目，其中移动版本与移动应用程序相同，但"桌面"版本完全不同。不同的导航，不同的卡片，以不同方式划分的视图。
在 PHP/Laravel和 HTML/CSS/JS 中执行此操作的最佳方法是什么？我问的是一般方法。
提前谢谢你。
K
这应该通过使用媒体查询的 css 来完成，通过这样做，您可以根据设备大小控制卡片大小和视图。您可以在 https://www.w3schools.com/css/css_rwd_mediaqueries.asp 中找到更多信息
我使用的"技巧"是使用不同的 css 样式表。
您可以为 css 样式设置最小值和最大值，例如：
@media (max-width: 600px) {
//put css here for very small screens
}
@media (min-width: 601px) and (max-width: 1024px) {
//put css here for medium sized screens
}
@media (min-width: 1025px) {
//put css here for large screens
}
请注意，这仅在您的 html 在所有屏幕上保持不变并且布局仅由不同的 css 定义时才有效。但在某些情况下，这是一种可能的方法。
但是差异很大，在我看来，仅使用CSS是不够的。元素大小和网格中位置的变化是显而易见的，并且存在于所有项目中。这是某种边缘情况。
例如，在桌面上，我在一个视图中有 2 个部分的用户配置文件，但在移动设备上我有两个专用的子页面。
在桌面上，我在导航栏中有普通菜单，但在移动设备上，每个视图的顶部和底部都有上下文按钮。
在桌面中，有些东西是模态的，但在移动设备中是单独的子页面或作为出现的文本标签(简单状态(。
。等等