关于meta标签设置viewport的content的width的疑惑

Question

关于meta标签设置viewport的content的width的疑惑

发布于
2017-11-07

更新于
2017-11-07

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=640,user-scalable=no" />
    <title>demo</title>
</head>
<body>
    <script>
        (function () {
            document.addEventListener('DOMContentLoaded', function () {
                var html = document.documentElement;
                var windowWidth = html.clientWidth;
                alert('windowWidth: ' + windowWidth);
            }, false);
        })();
    </script>
</body>
</html>

代码如上。我看网上说的是meta的width是设置手机浏览器的宽度，为什么这里alert的是512而不是640（在chrome下用iphone5）?

html css

html5 javascript

阅读 3.8k

1 个回答

得票最新

zwwill_木羽

6.3k2931

发布于
2017-11-07

✓ 已被采纳

viewport 的width 是可以设置移动端浏览器的逻辑宽度。猜测是旧版本手机系统的兼容问题
另外不建议如此做移动端适配，容易出现模糊情况，建议说那个 device-width ，使用媒体查询等方式做机型适配

撰写回答