如何在移动设备上强制缩小或缩小宽度？
Rya*_*yan 7 html css responsive-design twitter-bootstrap
我有一个基于响应的网站,建立在Bootstrap 2.3上.但是我需要缩小一个页面以适应不起作用的项目.如果我双击,它会完美地缩小.但我想以这种方式默认.
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
UPDATE
啊.我正在使用谷歌Chrome移动仿真进行调试.实际的移动设备使用html,body {min-width:1024px;}正常工作.我也投入了对一些内容进行解除责任.
专业提示:不要依赖谷歌Chrome移动仿真.
使用元标记来执行此操作
<meta name="viewport" content="width=device-width, initial-scale=1">
initial-scale --- 访问页面时的初始缩放。1.0 不缩放。
最小比例 --- 访问者可以在页面上缩放的最小量。1.0 不缩放。
最大比例 --- 访问者可以在页面上缩放的最大量。1.0 不缩放。
用户可缩放 ---- 允许设备放大和缩小。值为是或否。
- 是的，但是我上面的代码包含确切的元标记。我还尝试过：“user-scalable=yes”和“width=1024”。两者在加载时仍然会导致隐藏内容。双击即可显示。 (3认同)
| 归档时间： |
|
| 查看次数： |
7924 次 |
| 最近记录： |