如何定位小于特定屏幕尺寸的设备

Question

我有一个响应式网页，在 750 像素之前非常适合，然后遇到麻烦。它需要大量的 CSS 才能使它看起来不错，而且这是一个非常hackish 的解决方案。

有没有办法，如果浏览器尺寸小于 750 像素，将它们带到具有自己的标记、样式等的特定页面？

谢谢，乔丹

Answer 1

您可以实施媒体查询

例如：

@media all and (max-width: 750px) {
/* CSS rules here for screens lower than 750px */
}
@media all and (min-width: 750px) {
/* CSS rules here for screens above 750px */
}

另请参阅媒体查询简介 - 第 1 部分：什么是媒体查询 - Adob​​e、媒体查询 - 维基百科、免费百科全书和CSS3 媒体查询概述 - CSS 媒体查询