我正在处理的网站的响应式布局存在问题。
Senario：该网站有 3 种不同的桌面版、平板电脑版和移动版布局。它们具有几乎相同的组件（带有一些 CSS 调整），可以由 Media Query 轻松处理。我的客户的要求是该站点必须具有响应性，并且应该根据浏览器的大小进行调整。
问题： 问题是一些 div 在不同的布局中移动位置。假设 Div1 有 subdiv1、subdiv2 和 subdiv3。在某些情况下，其他一些 div 说 Div2 会有一些 subdivs 并且 Div1 的 subdiv2 必须显示在 Div2 的 subdivs 之间。布局的组件位置在父级别上有所不同，这给我们带来了很多关于如何处理它的问题。
我们正在考虑的解决方案：
- 根据用户事件创建不同的主题：此解决方案不可行，因为主题本身不会响应，或者即使它们是响应的，也不会采用客户认可的布局。
- 使用 jquery 在加载和调整大小时将组件转移到不同的父级：这可能会减慢我们的网站速度并可能出现其他问题。
- 使用 CSS 隐藏显示同一组件的不同实例：这个解决方案听起来很糟糕。
还有其他我们忽略的好的解决方案，更好的方法吗？即使在这些方法中的任何一种中，我们都想知道哪一种是最好的解决方案？
我们正在考虑许多因素，例如性能、SEO、加载时间等。
我真的很困惑，非常感谢一些建议。