<!DOCTYPE HTML><HTMLLang= "ZH-CN"><Head> <MetaCharSet= "UTF-8"> <Metahttp-equiv= "X-ua-compatible"content= "Ie=edge"> <title>Document</title> <Script>
<!--get pixel ratio: window.devicepixelratio
1/pixel = scale scale--
varInitscale= 1 /window.devicepixelratio; document.write ('<meta name= "viewport" content= "width=device-width,user-scalable=no,initial-scale='+Initscale+', minimum-scale='+Initscale+', maximum-scale='+Initscale+'">');
varInitwidth=window.document.documentElement.clientWidth; document.getElementsByTagName ('HTML')[0].style.fontsize=Initwidth/ - + 'px';
</Script> <style>Body{margin:0;Overflow:Hidden; }. Box{width:10rem;Height:10rem;margin:0.33333rem;background:Pink;float: Left;font-size:30px; } </style></Head><Body> <Divclass= "box">Box1</Div> <Divclass= "box">Box2</Div> <Divclass= "box">Box3</Div> <Divclass= "box">Box4</Div> <Divclass= "box">Box5</Div> <Divclass= "box">Box6</Div></Body></HTML>
Dynamically set scaling and HTML font size