在桌面浏览器上调整视口大小答案

【问题标题】：Viewport Resizing on Desktop Browsers在桌面浏览器上调整视口大小
【发布时间】：2013-09-07 04:02:45
【问题描述】：

我有一个客户想要一个响应式网站，该网站可以满足 1400 像素到 960 像素宽的屏幕。低于此值的任何内容都可以显示水平滚动条。该网站必须保持与屏幕的左右边缘齐平。

起初我认为使用媒体查询、一些 javascript 和其他现代“响应式”技术很容易实现。我已经走上了这条路，虽然这是我第一次体验一个成熟的响应式网站，但这并不太难。我不得不对图像、标题大小、文本大小等进行大量动态调整。大量的工作和测试，但值得。还是不行？？！！

现在我意识到移动 Safari 有效地内置了这项技术。通过视口调整大小。这就是为什么在 ipad 上，960 像素和 1200 像素宽的网站都会对齐到浏览器窗口的边缘。

我的问题是“是否可以像移动 Safari 在 iOS 上那样模拟桌面浏览器中的视口调整大小？”

【问题讨论】：

【解决方案1】：

种类，使用百分比或 em，例如

body{
    width: 100%; 
}
content{
    width: 60%;
    float: left;
}
sidebar{
    width: 35%;
    float: right;
}

然后您可以使用媒体查询使用 ems 调整文本大小

【讨论】：