移动端

来源：互联网发布：啾米网络是培训机构吗? 编辑：程序博客网时间：2024/05/22 04:38

<!DOCTYPE html><html style="width: 400px;"><head ><meta charset="utf-8" /><title></title><!--<meta name="viewport" content="initial-scale=1" /><meta name="viewport" content="width=100" />--><!--<meta name="viewport" content="width=100" /><meta name="viewport" content="initial-scale=1" />--><!--<meta name="viewport" content="initial-scale=1" /><meta name="viewport" content="width=600" />--><!--<meta name="viewport" content="width=600" /><meta name="viewport" content="initial-scale=1" />--><meta name="viewport" content="width=100" /><!--<meta name="viewport" content="width=600" />--><!--<meta name="viewport" content="initial-scale=1,width=100" /><meta name="viewport" content="initial-scale=1,width=600" />--><!--<meta name="viewport" content="width=100,initial-scale=1," /><meta name="viewport" content="width=600,initial-scale=1," />--><style type="text/css">*{margin: 0;padding: 0;}#one{width:500px;height: 500px;border: 1px solid red;display: inline-block;}</style><script src="js/jquery-1.9.0.js" type="text/javascript" charset="utf-8"></script></head><body><div id="one">大棒棒</div></body><script type="text/javascript">console.log("clientWidth====="+document.documentElement.clientWidth)console.log("offsetWidth====="+document.documentElement.offsetWidth)console.log("innerwidth====="+window.innerWidth)</script></html>

综上：个人理解： meta标签width--->clientWidth 当initial-scale不存在时页面会按照innerwidth为渲染的层面然后缩放致占满如果initial-scale存在页面会按照innerwidth为渲染的层面然后按照initial-scale的innerwidth与320的比例进行扩大

clientwidth值为width与initial-scale值的320最大值

320为ipone5的x

阅读全文

0 0