微信场景开发的尺寸问题

昨天做了一个微信场景,在谷歌的模拟器上没有问题,可以完全还原设计图,但是到了移动端一些问题出现了。不管使用微信浏览器还是qq浏览器或者移动端其他浏览器,都会出现一页的东西显示不全,下面的一部分会显示不出来。

由于我的使用的是背景图,而且很明显下面一部分背景图没有显示出来,一开始background-size:cover;是不能解决的,所以就用background-size:100% 100%;这样背景图就完全显示出来了,但是会有一点点变形,如果要求不高,背景图的问题就解决了。还有就是写在页面中的东西,如果有的元素在底部的话,就需要把top的值减小了。但是觉得一点点改回很繁琐,所以下一次最好关于微场景这种只允许出现一屏的内容的页面最好用百分比写top,如果是平时的网页的话就不用顾及这些问题了,就按设计图写就可以了,因为多出来的部分会出现滚动条,不会出现显示不全的问题。

在自适应上我用的是rem,rem计算方法如下:document.documentElement.style.fontSize = document.documentElement.clientWidth/设计图的宽度+'px';    这样得出来的1rem = 100px;

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值