如何让我的网站在手机上默认缩小？

所以我希望用户能够在我的网站上看到我的背景。目前，我的网站宽度为，当您在移动浏览器（例如iPhone，Opera Mini）中查看网站时，它会放大文字，并且用户看不到背景。如何让我的网站在手机上默认缩小？

我试过使用meta viewport标记失败。如何让我的网站在移动浏览器上默认缩小？

编辑：

这是到目前为止，我已经试过代码：

<meta name = "viewport" content = "width = device-width">

来源

2010-08-30 Kredns

我知道这是一个老问题，但无论如何我都会回答，以防其他人需要答案。

截至2011年9月，Opera Mini仍在使用Presto渲染引擎2.5版本。在Presto 2.7之前，视口在Opera中不可用。（Opera移动，我们的智能手机浏览器确实支持视窗）

试试这个：

<meta name="viewport" content="initial-scale=0.25">

当你包括width=device-width，浏览器“神奇” **找到的内容区域，并调整它来填充设备的宽度。如果您希望通过背景进行浏览，则需要缩小整个页面以适合视口。

离开<meta name=viewport>完全可以工作，但你通常会看到较少的背景图像。

但是，理想情况下，您还应该使用媒体查询来创建适用于各种宽度的网站。

**使用某种浏览器开发人员能够比我更好地解释的启发式。

来源

2011-09-21 20:09:57 webinista

这让我感到非常紧张。感谢这个虽然很大的帮助 – locrizak 2011-10-25 19:30:52

我很惊讶meta viewport没有为你工作（在移动Safari浏览器）。你可以发布你使用的？

UPDATE：这一般适用于我......试试看：

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />

如果这样的作品，那么你就可以开始与刻度值播放，让用户放大，如果他们想以及多少。

来源

2010-08-30 12:57:17 donohoe

好吧，我用我正在使用的代码更新了我的问题。 – Kredns 2010-08-30 15:00:45

我试过了。它仍然放大。请参阅：http://bellasbowz.com – Kredns 2010-08-30 20:08:03

此解决方案强制浏览器被放大，而不是像问题那样缩小。 – Steve 2014-03-13 11:30:23

经过多次试验和错误，我得到以下在iPhone 5.0.1和Android 2.3.6上正常工作。该网站的设计宽度为480。根据您网站的宽度，您必须使用iPhone的宽度值。

<meta name="viewport" content="width=520, target-densitydpi=high-dpi" /> 
<meta http-equiv="Content-Type" content="application/vnd.wap.xhtml+xml; charset=utf-8" /> 
<meta name="HandheldFriendly" content="true" /> 
<meta name="apple-mobile-web-app-capable" content="yes" />

来源

2012-05-20 04:11:36 Nomad77

我不得不把更大的宽度（1300），使其工作。 +1因为我很绝望。 – 2014-02-20 15:20:57

如何让我的网站在手机上默认缩小？

回答

相关问题