Question

我正在开发一个PHP / MYSQL网站。对于大多数页面，使用Bootstrap的响应式设计很好。但是对于几页而言，不仅列必须重新排列 xs屏幕尺寸，而且各部门的内容也会发生变化。以下是 xs版本的页面示例。

。

我做的很简单：我使用hidden-xs隐藏大屏幕上的布局，visible-xs显示小屏幕上的布局。所以我猜这个页面需要两倍的资源来加载，这不是很优化的。

当只涉及几页时，是否有更优化的方法来处理不同风格和内容的不同屏幕尺寸问题？（如果所有页面都非常不同，我想最好的解决方案是在子域上创建移动版本）。

Answer 1

我熟悉一种方法，虽然我个人从未有机会使用它。您可以为不同的屏幕尺寸创建样式表。

<head>
      <link rel='stylesheet' media='screen and (min-width: 1px) and (max-width: 257px)' href='your-css.css'/>
</head>