资讯专栏INFORMATION COLUMN

vueh5项目模板基于rem布局

caohaoyu / 843人阅读

摘要:我找的方向还是手机适配的问题。嗨距离出家还早着呢效果图效果图安卓手机效果图基本上各种手机效果是一样的,弹性布局。

vue+rem布局h5弹性布局模板 须知:

1、默认设计图尺寸 宽度750,测量多少写多少px就ok;
2、px会自动转换为rem单位,实现弹性布局;
3、字体不要转rem(原因自己查),为了避免被转为rem ,需要在font-size后加/px/ 举个栗子:font-size:14px;/*px*/ ;
4、css预处理区用的stylus 已经内置了,也推荐用这个因为是基于node的,无须安装ruby环境;
5、在webview下如果安卓手机设置了字体大小,那么rem布局就凉了,所以最好让andriod同志们加上,如下代码设置webview默认字体,在每个webview配置
webview.getSettings().setTextZoom(100)
坦白的讲这个坑我找了一礼拜,因为我手机把字体放大了,所以rem布局有的地方就乱了。我找的方向还是手机适配的问题。嗨距离出家还早着呢

5/5s效果图

6/6s效果图

安卓手机效果图

基本上各种手机效果是一样的,弹性布局。 github地址:https://github.com/proactivef... 欢迎拍砖

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/99819.html

相关文章

  • Functional CSS: 从试着改进可重用CSS做起

    摘要:从试着改进可重用做起泊学视频回想起每次更新泊学网站,最让我头疼的,就是改写。于是我几乎不假思索的写出了这样的模板它同样包含了一个封面图,一个标题和一个简介。 从试着改进可重用CSS做起 泊学4K视频 回想起每次更新泊学网站,最让我头疼的,就是改写CSS。在不同的阶段,对CSS不断深入的理解,对网站内容的调整,对UI的重用需求,都影响着CSS的编写方式,因此,稍不留神,你的代码理解就会充...

    microelec 评论0 收藏0
  • 从零搭建移动H5开发项目实战

    摘要:并且除了常用的端,还要考虑微信端,或者是端。所以我们要有一套机制,在端上走的代码,在端或者微信端上走端对应的代码。对于一个从零开始的移动端项目,我总结了以上这些移动开发难点,希望之后的人能少踩点坑,站在我的肩膀上提高项目开发的效率和质量。 从零搭建移动H5开发项目实战 前端H5的前世今身 在Pc的时代,前端技术无疑统治了大多数用户的交互界面!而在移动为王的今天,NA开发在早期占领了大多...

    terro 评论0 收藏0
  • 从零搭建移动H5开发项目实战

    摘要:并且除了常用的端,还要考虑微信端,或者是端。所以我们要有一套机制,在端上走的代码,在端或者微信端上走端对应的代码。对于一个从零开始的移动端项目,我总结了以上这些移动开发难点,希望之后的人能少踩点坑,站在我的肩膀上提高项目开发的效率和质量。 从零搭建移动H5开发项目实战 前端H5的前世今身 在Pc的时代,前端技术无疑统治了大多数用户的交互界面!而在移动为王的今天,NA开发在早期占领了大多...

    pepperwang 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<