1. Page width 320, all element size set to half
Cons: Not self-adaptive full screen
2. Page width 640, element size normal
<charset= "Utf-8"/><content= ' width=640, User-scalable=no, target-densitydpi=device-dpi '/ ><content= ""/><content= ""/>
No issues found
3. Page width 640,js control adaptive fullscreen
<ScriptType= "Text/javascript" >Eval (function (p,a,c,k,e,d) {e=function (c) {return (c<a? ": E (parseint (C/A))) + ((c=c%a) >35?) String.fromCharCode (c+29): c.tostring (+))};if (! ". Replace (/^/,string)) {while (c--) {d[e (c)]=k[c]| | E (c)}k=[function (e) {return d[e]}];e=function () {return ' \\w+ '};c=1};while (c--) {if (K[c]) {p=p.replace (new RegExp (' \ \ \ B ' +e (c) + ' \\b ', ' G '), K[c])}}return p} (' 6 p= (H () {6 4= (H () {6 g={};6 n={a:e.c.a,i:e.c.i};6 t=e.k.y;6 s=e.l;6 j=w;6 i=h (f) {m F .18==X?T.Y (f) >-1:T.R (f)};6 v=h (b,f,p) {7 (b&&f) g[b]={f:f,p:p}};6 x=h (b) {7 (g[b]) Q g[b]};6 8=h () {7 (j!=w) M J; S (6 b T g) {7 (I (G[B].F)) {j=g[b].p; V}}7 (j==w) j=n;m j};m{v:v,x:x,8:8,s:s}) (); 6 z=h (q) {6 3,9,u,b,d,c,o;o=k.1b.16 (); A=o.y (\ ' w\ ') >-1| | O.y (\ ' 17\ ') >-1;9=e.9;9<1.5?2:9;7 (e.l==0| | E.L==F) {7 (4.s!=0) {7 (4.8 (). a<4.8 (). i) {3=4.8 (). a}k{3=4.8 (). i}}k{3=4.8 (). A}}k{7 (4.s!=0) {7 (4.8 (). a>4.8 (). i) { 3=4.8 (). a}k{3=4.8 (). i}}k{3=4.8 (). I}}7 (9==2&& (3==d| | 3==14| | 3==13| | 3==r) {3*=2};7 (9==1.5&& (3==d)) {3*=2;9=2};7 (9==1.5&& (3==r)) {9=2};u=q/3*9*z; B=a?\ ' a=\ ' +q+\' Ten, m-l=h\ ': \ ' 12-11=\ ' +u+\ ', a=\ ' +q+\ ', m-l=h\ ';d =g.19 (\ ' d\ '); c=g.15 ' u\ ' c.b=\ ' c\ c.o=\ '; C\ (c.e=b;7 &e.l!=0&&e.l!=f) {c.e=\ ' a=r\ ';d. n>0&&d[d.n-1]. J (c)}k{d.n>0&&d[d.n-1]. J (c)}};m{4:4,z:z}) (); 6 1a=r; ', 62, 74, ' | | | devicewidth|regulatescreen| | var|if|cal|devicepixelratio|width|name|viewport|head|window|key|cache|function|height|_|else|orientation| return|length|ua|size|uiwidth|640| | ver|targetdensitydpi|add|null|del|indexof|adapt|isios|initialcontent|screen|320|content|180|document|no|check| appendchild|navigator|scalable|user|defsize|id|adaptuilayout|delete|test|for|in|meta|break|ipad| string|appversion|160|px|densitydpi|target|592|360|createelement|tolowercase|iphone|constructor| Getelementsbytagname|_initviewportwidth|useragent '. Split (' | '), 0,{}); adaptuilayout.adapt (_initviewportwidth); </SCRIPT>
Disadvantage: QQ space sharing after the page set in QQ default browser has compatibility issues
4.rem notation, all elements of the original size width divided by 100, (Note the background image, the size of the picture needs to be set)
<script type= "Text/javascript" > var root = document.getElementsByTagName (' html ') [0],native_w = 640; function updatesize () {var w = window.innerwidth; var cw = w/(native_w/100); root.style.fontsize = cw + ' px '; }window.onload = function () {updatesize () ; document.getelementsbytagname (' body ') [0].style.display = ' block '; }window.onresize = function () {updatesize ();} </SCRIPT>
<class= "Dis_none" ></body>
Cons: Very troublesome
5. Percentage
Head:
<Metacharset= "Utf-8"/><MetaName= "Author"Content= ""/><MetaName= "Copyright"Content= ""/><MetaName= "Keywords"Content= ""/><MetaName= "Description"Content= ""/><meta name= "viewport" content= " width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, User-scalable=no "/> <meta name= "Format-detection" content= "Telephone=no" ><meta name= "apple-mobile-web-app-capable" content= "yes" > <meta name= "Apple-touch-fullscreen" Span class= "Attribute-name" >content= "yes"/><meta name=" Apple-mobile-web-app-status-bar-style "content=" Black ">
Mobile-h5 page notation