1

用他干嘛?

image.png
flexible.js适配方案采用rem布局,
根据屏幕分辨率大小不同,调整根元素html的font-size,
从而达到每个元素宽高自动变化,适配不同屏幕


Vue中怎么用

安装:cnpm i lib-flexible -S
引入:import 'lib-flexible/flexible'(在main.js你懂得)
此时咱们用审查元素查看会有这个东西
image.png

你再试试别的移动适配就会发现,他们原来是自动的。


你以为就这么完了吗?

因为项目跟你的尺寸不一样,随之的rem也不一样。默认的是10
在自己node_modules
image.png
你会发现第74行那句:var rem = width / 10;
如果你写的这个盒子150px, 则转换成15rem


懒得计算

每次自己计算成rem 太麻烦了。怎么办呢
我使用了出名的 Vs code。这里面下载一个插件cssrem。安装之后就有自动转换的值。
妈妈在也不用担心我的学习!步步高打火机!哪里不会点哪里!搜一贼!
o( ̄︶ ̄)o
image.png

爱我你怕了吗?
image


赵不悔
96 声望4 粉丝

我以为租来的人生也能幸福…要不是幸福终究有个期限,我也就信了。


« 上一篇
Vue音乐小实战
下一篇 »
伪类收藏

引用和评论

1 篇内容引用
0 条评论