3

有几种方法可以布局网页以使其适合浏览器视口 (DOM window)。当我说“适合”时,我包括更改所使用字体的大小,更改 DIV、IMG 和其他渲染元素的宽度和高度,以及允许元素的“流畅”移动。目标是使页面在所有显示设备上看起来都“漂亮”,从小型手机到大型桌面屏幕。这些布局方式包括使用 CSSem%尺寸、文本和元素的换行以及onloadonresize事件。布局拟合可以几乎完美地跨浏览器工作,但复杂的结果可能对浏览器缩放不敏感,因为缩放会神奇地改变窗口宽度,这意味着没有任何独立于浏览器的可靠方法来检测缩放(DOM 和CSS 标准忽略浏览器缩放)。无法检测由于设备屏幕小而导致的小窗口宽度与由于缩放因子大而导致的小窗口宽度之间的差异。我们希望以不同的方式处理这两种情况,因为视力受损的用户需要使用缩放因子。

有没有人以尊重缩放的方式成功地调整布局(包括更改字体大小)?例如,如果用户以 200% 的缩放比例访问页面,则最初只应显示页面的左上四分之一(其余部分可通过水平和垂直滚动获得),而同一页面将完全适合窗口对于另一个将缩放设置为 100% 的用户。

4

2 回答 2

0

实际上,要拥有流畅的布局,您将不得不使用 % 来确定宽度而不是像素。并且为了适合屏幕使用 100%

于 2013-04-10T18:58:55.943 回答
-1

只需添加以下元标记

<meta name="viewport" content="width=device-width,
                      initial-scale=1.0,
                      maximum-scale=1.0,
                      user-scalable=0">
于 2014-06-28T17:33:13.460 回答