为什么移动浏览器会加载我的页面完全放大?

tim*_*tes 9 css iphone mobile android zoom

我目前正在为客户工作一个网站(仍在进行中),并尝试修复网站上的一些移动问题.

我遇到的主要问题是移动浏览器(android + iphone)加载网站完全放大网站的左上角部分.无论视口的宽度如何,我都希望它缩小以适应视口中的整个网站宽度.

该网站可在此处查看:http: //www.graceprep.com

这有一个简单的解决方案吗?我对HTML/CSS很有经验,但在移动浏览器方面我有点新手.

这是我的header.php文件中的一些HTML可能是相关的.我尝试更改width属性无济于事.初始规模属性是有效的,但过于宽泛 - 我希望所有移动浏览器都能完全缩小网站,无论方向或屏幕大小.

有没有办法做到这一点?

Gre*_*zzo 8

为什么你有这个元标记?如果完全删除它,设备将自动决定缩放级别.


rho*_*son 5

我几乎肯定

<meta name="viewport" content="width=device-width, initial-scale=1">
Run Code Online (Sandbox Code Playgroud)

应该解决这个问题。您可以将“宽度”设置为您想要的任何值,但通过将其设置为设备宽度,它将调整为任何设备的像素宽度值。“initial-scale”控制指定宽度的缩放级别。