适配手机端的几种写法

1,rem布局,现在普遍常用的方法

一般ui设计师给的页面都是640的,所以

document.documentElement.clientWidth/6.4+"px";
项目中,在ps中量的尺寸直接除以100,后面写rem就可以了。
window.οnlοad=function(){
				//1.首次加载的时候 调用动态设置rem的api
				setRemSize();
				window.addEventListener("resize",setRemSize,false);
				function setRemSize(){
				//1.在任何尺寸中都可以获得rem值
				var _clientWidth=document.documentElement.clientWidth/6.4+"px";
				//将得到的rem值赋值给根元素的font-size
				document.documentElement.style.fontSize=_clientWidth;
				}
		};

2.百分比布局

这种方法比较古老,做出来的界面在各个分辨率的适配上比较不好,例如一个div在分辨率为320*568是320px * 100px  在375 * 667 的分辨率显示就是 375px * 100px 效果不是等比拉升。


3,按照640等比例缩放。



你可能感兴趣的:(html)