0%

小程序1rpx边框ios真机显示不全问题

小程序在iphoneX、iphone6、6p等真机上如果有一排带边框的input标签时,可能会出现个别边框显示不全的问题,

出现原因:

当标签的父容器宽度(单位rpx)÷2的值为偶数或偶数.5的时候会出现该bug,那么我们可以推到出用200.52=401,3022=604等等都会重现这个bug,

解决方案:

  1. 第一种方式是设置标签父容器的宽度到无bug值,即(奇数或奇数.5)2,例如2812rpx,281.5*2rpx可以解决;
  2. 第二种方式是补充像素单位:步骤1中wxml增加space的view后如下:<view class='space'></view>,步骤1中wxss中增加space类为:.space{width:1rpx;height:100%;float:left}
  3. border用background-image替代,即用切一个1px的背景图当容器的边框
  4. 写成行内样式,避免渲染问题产生