# 导入所需要的组件
import { Button } from 'vant'
# 把Vant组件变成局部组件
components: {
[Button.name]: Button
}
# 在视图中使用vant组件
<van-button type='danger'>按钮</van-button>
# rem布局
dpr = 屏幕像素(px) / 物理尺寸
dpr = 2 二倍屏
dpr = 3 三倍屏
移动端布局:vw/vh,flexible,rem(最常用)
rem:相对html标签的根字体大小,倍数关系
em:相对于父级字体的大小,倍数关系
px:绝对单位
目标:10rem等于满屏
做法:把当前页面的根字体的大小等于当前屏幕宽度的1/10
第一步获取html标签dom对象 oHTML
第二步通过js获取当前屏幕的宽度 w(单位是px)
第三步,oHTML.fontSize = w*0.1 + 'px'
代码实现

建议在vscode安装一个cssrem的插件,它的作用是自动帮我把px单位转化成rem单位。
它需要进行基准单位设置,设置成75(1rem=75px)
网友评论