Question

我有一个响应很快的网站，建立在Bootstrap 2.3之上。但是我需要缩小一个页面以适应不起作用的项目。如果我双击，它会完美地缩小。但我想以这种方式默认。

skitch

HTML：

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div class="container-fluid" style="min-width:1024px">
    <div class="row-fluid">
        <div class="span12">
            <!-- arbitrary content. point is: zoom out by default, don't crop img -->
            <img src="1024x768.png">
        </div>
    </div>
    <div class="row-fluid">
        <div class="span12">
            <!--
                 if min-width is observed, these should be side by side
                 instead of wrapped like responsive normally does
            -->
            <img src="300x768.png"><img src="300x768.png"><img src="300x768.png">
        </div>
    </div>
</div>
</body>

注意：我不是要禁用缩放功能。我只是想默认缩小。

我尝试了以下但没有成功：

1. <meta name="viewport" content="width=1024">

2. <meta name="viewport" content="user-scalable=yes">

3. body { float:left; min-width:1024px; }

4. min-width on all wrapped objects

更新

唉。我正在使用谷歌Chrome移动仿真进行调试。实际的移动设备使用html，body {min-width：1024px;}正常工作。我也投入了对一些内容进行解除责任。

专业提示：不要依赖谷歌Chrome移动仿真。

Answer 1

使用元标记执行此操作

<meta name="viewport" content="width=device-width, initial-scale=1">

initial-scale ---访问页面时的初始缩放。 1.0不会缩放。

最小规模---访问者可以在页面上缩放的最小数量。 1.0不会缩放。

最大比例---访问者可以在页面上缩放的最大数量。 1.0不会缩放。

用户可扩展----允许设备放大和缩小。值是或否。

Source

如何在移动设备上强制缩小或缩小宽度？

1 个答案: