同步操作将从 buqiyuan/vite-vue3-h5 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
移动端vant3.0 + vue3.0 + vite2.0 + ts + REM布局 + Viewport (VW) 布局的实例运用
http://buqiyuan.gitee.io/vite-vant3
提供三个布局方案
1. REM 布局
使用js动态设置html的font-size,css使用rem单位,文本大小可选择使用px
js设置viewport的scale以支持高清设备的1px
可设置页面最大最小宽度
2. VW 布局
css使用vw单位,文本大小可选择使用px
使用transform以支持高清设备的边框1px(包括圆角),使用 @mixin ./vw/scss/_border.scss
可设置容器固定纵横比,不可设置页面最大最小宽度
3. REM + VW 布局
html的font-size使用vw单位,css使用rem单位,文本大小可选择使用px
使用transform以支持高清设备的边框1px(包括圆角),使用 @mixin ./vw-rem/scss/_border.scss
可设置容器固定纵横比,可设置页面最大最小宽度
yarn dev
业务代码中样式的调用方式可参考 ./rem/scss/rem.scss
及 ./vw/scss/vw.scss
及 ./vw-rem/scss/vw-rem.scss
三个文件;可在html文件相应位置配置 data-content-max
属性来限制容器最大最小宽
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。