vue写h5页的方法概述

下面是如何用vue写h5页面，这是边肖带来的。希望能给你带来一些帮助。谢谢观看。

1.当你拿到设计师给出的UI设计图时，前端的重中之重是布局和风格，相信对于大部分前端工程师来说都没有问题。移动终端的布局比PC简单，关键在于不同设备的适配。

2.之前介绍过一个移动rem布局方案，大致是网易H5的适配方案。但在实践中发现，淘宝开源的可扩展布局方案更好，更容易使用。方案总结如下：根据屏幕大小/750=所需字体/基准字体大小的等比例，动态调整html的字体大小。

3.方案总结如下：根据设备的像素比设置比例的值，保持视口设备-宽度始终等于设备的物理像素，然后根据屏幕大小动态计算根字体大小，具体来说就是把屏幕分成10等份，每份为A，1雷姆等于10a。

4.通常我们会得到一个宽度为750的设计稿，这是基于iPhone6的物理分辨率。有些设计师可能比较懒，设计图上没有标注。如果我们在发展的同时测量维度，效率无疑会相对较低。要么让设计师标注，要么自己谋生。

5.如果设计师真的没时间，建议用markman做标记。免费版阉割了一些功能(比如不能保存本地)，但基本满足了我们的需求。

6.阅卷后，我们开始写自己的风格。使用淘宝的lib-flexible库后，我们根字体的基准值是750/100*10=75px。此时，如果一个标记为100px，则应该在css中设置为100/75=1.333333rem。所以为了提高开发效率，可以使用px转换成rem的插件。如果你使用升华文本，你可以使用快速眼动单位。

如果学习后有什么问题，可以在下方留言区讨论。谢谢你的支持。