移动端布局方案

最新推荐文章于 2023-09-23 08:50:32 发布

如此荒废光阴

最新推荐文章于 2023-09-23 08:50:32 发布

阅读量199

点赞数

分类专栏：笔记

本文链接：https://blog.csdn.net/qq_46397904/article/details/104897201

版权

笔记专栏收录该内容

7 篇文章 0 订阅

订阅专栏

移动端布局方案：
1、rem+vw
1、需要设置meta标签
2、750px 的设计稿要在 html{font-size:26.67vw}；
3、640px 的设计稿要在 html{font-size:31.25vw}；

	   	 4、计算方式：当前元素的尺寸 / 2(dpr)  / 100px   =  ?rem
	   
	2、flexible.js
 		<!-- 引入js文件 进行适配 -->
		<script src="js/flexible.js"></script>
	   说明：
		此方式也是rem布局，而且计算超级简单。但是也有需要注意的地方
		1、设计稿尽量是按照750的设计稿来定
		2、不需要设置meta标签
		
		3、计算方式：当前元素的尺寸/100 = rem值
		
		优点：动态改变dpr的值来保证根元素字体的大小
		
		
	改变设计稿大小：
		ps ->  图像 -> 图像大小  ->  改变宽度值为750px;