vw、rem屏幕适配
一、适配750px的屏幕vw
①公式:适配屏幕宽度(vw0=100vw*设计稿div宽度/设计稿宽度)
②calc计算写法:(width:calc(100vw*计稿div宽度/设计稿宽度))
③安装vscode插件便于计算适配的可视宽度,及相关设置
插件名称:px2vw
二、适配屏幕rem:
①rem单位 是相对长度单位(找到参照物)参照的 根标签(html)的fontsize
②谷歌浏览器默认字体大小为16px,最小为12px
③如果 设置了 html的字体大小 设置为 1px
1 rem = 1px ?
但是对于字体来说 最小还是 12px(谷歌) 火狐(最小文字1px)
④使用js(由淘宝团队开发)改变屏幕宽度改变fontsize,注意需将js标签写道html内
⑤小结
1 rem 大小是相对于页面根标签的字体大小
2 不要去研究 rem小于 12的时候的情况(自己设置尽可能将html的字体设置为大于等于12 避免问题即可)