移动端准备工作:
1:<meta name="viewport" content="width=device-width,initial-scale=1.0,
maximum-scale=1.0,user-scalable=no">
2:单位:px、pt、em、%
em相对大小(相对于父元素的font-size的值)
rem!!!默认情况下 1rem=16px;
原理:rem的值是根据根元素html的font-size发生变化。
3:ppi dpi dpr(设备像素比)=物理像素(设备显示)/逻辑像素(css设置的)
4:100vw==视口的百分之百
font-size==100px 具体的像素值
640/320px 100vw 1px 100/320 31.25
750/375px 100vw 1px 100/375 26.67
单位
vw 100vw==视口宽度100%
vh 100vh==视口高度100%
iPhone 5 屏幕 :320*568
iPhone 6/7/8 屏幕:375*667
适配:375/320*568=665.625≈667
第二十二篇心得
最新推荐文章于 2024-08-31 22:15:20 发布