【问题标题】:Differences in rendering mobile chrome and android native browser渲染移动端chrome和android原生浏览器的区别
【发布时间】:2014-05-08 09:31:44
【问题描述】:
在我的智能手机上测试我的桌面(无响应)网站时,我注意到在 chrome (34.01847.114) 和原生 Android 浏览器 (4.3) 中呈现网站的差异。在 Chrome 中,页面按照我的意愿在没有缩放的情况下呈现。在本机浏览器中,页面被放大。我不使用任何 viewprt-tag。
当我将视口标签设置为
<meta name="viewport" content="width=device-width">
chrome 的行为类似于本机浏览器并进行缩放。
所以我不想要任何缩放,我希望网站以全分辨率呈现。
【问题讨论】:
标签:
android
google-chrome
viewport
【解决方案1】:
为了防止缩放,你应该使用:
<meta name="viewport" content="initial-scale=1">
希望对你有帮助:)
【解决方案2】:
您确定该页面实际上已在 Android 浏览器中放大了吗?我的观察是,如果您只是一遍又一遍地重新加载相同的页面,以前的缩放通常会保持活动状态,这可能会误导您认为这是页面将为用户加载的方式。但是,除了使用刷新/重新加载之外,页面在正常加载时会正常加载。因此,我建议您在可靠地检查缩放行为时确保导航到新页面。
否则,如果您仍然有问题并且您的桌面网站具有固定宽度,您可以简单地将视口设置为:
<meta name="viewport" content="width=fixed-width,initial-scale=1">
其中 fixed-width 是您的固定桌面目标宽度(以像素为单位)。
这将为您提供一个完整的宽度,并根据每个移动设备的屏幕尺寸重新缩放。