rem移动端适配

最新推荐文章于 2024-10-16 19:56:07 发布

qq_58875046

最新推荐文章于 2024-10-16 19:56:07 发布

阅读量408

点赞数

文章标签： css html javascript

本文链接：https://blog.csdn.net/qq_58875046/article/details/123068459

版权

直接上代码

    //px to  rem
	(function(){
		function pxtorem(){
			let html=document.documentElement;
			let htmlW=html.clientWidth;
			let designW=750;
			if(htmlW>designW){
				html.style.fontSize="100px"
			}else{
				html.style.fontSize=(htmlW/designW)*100+"px"
			}
		}
		pxtorem()
		window.addEventListener("resize",pxtorem())
	})()

750px设计稿为例

当设备大于750px时，1rem=100px，当小于750px是1rem=设备宽度/750x100px