效果，如下图所示。
通过remote dug发现在在ios上，border:1rpx 被渲染为 0.5px。
ios12上部分border显示不正常，安卓ok。
收藏
回答
置顶border 1rpx不能正常显示精选热门
#.o0OfF ~ lbb2018-12-21
| 框架类型 | 问题类型 | 操作系统 | 操作系统版本 | 手机型号 | 微信版本 |
|---|---|---|---|---|---|
| 小程序 | Bug | iOS | ios12 | iphone7plus | 6.7.4 |
6 个回答
请 登录 后发表内容
相关问题
| 框架类型 | 问题类型 | 操作系统 | 操作系统版本 | 手机型号 | 微信版本 |
|---|---|---|---|---|---|
| 小程序 | Bug | iOS | ios12 | iphone7plus | 6.7.4 |
效果，如下图所示。
通过remote dug发现在在ios上，border:1rpx 被渲染为 0.5px。
ios12上部分border显示不正常，安卓ok。
6 个回答
1rpx的border, 在ios上会粗细不均，建议1rpx的边框，自己绘制吧
类似这样：
<viewstyle='width: 98rpx; height: 40rpx; color: white; font-size: 18rpx; display: flex; align-items: center; justify-content: center; box-sizing: border-box; position: relative;'>活动说明<viewclass='border'></view><!-- 这个才是边框 --></view>.border::after {content:'';position:absolute;/* 把父视图设置为relative，方便定位*/top:0;left:0;width:200%;height:200%;transform: scale(0.5);transform-origin:00;box-sizing: border-box;border-radius:40rpx;border:2rpxsolid#fff;}利用after伪元素，生成宽高是200%、边框是2rpx的一个视图，通过缩放0.5倍，获得一个和父视图边框一样的边框，可以把2rpx的边框缩为1rpx的边框，在ios上也能保证粗细一致。
已经用postscc相关插件解决了
transform: rotateZ(360deg);+1
来个人回答一下嘛
父容器宽度除以2，得出的值是偶数或偶数.5，就会出现这个bug;例如父容器宽度是200rpx，就设成202rpx试一下，这是在ios上会出现的bug;
我搜到的资料说ios9以上好像已经修复了border .5px渲染为0的问题，我也不太确定。
遇到同样问题，请问解决了吗？
改写为1px,粗就粗一点吧，不然只能加postcss插件做处理了
多谢！ 我遇到的是左侧不显示，加了个margin-left:1rpx 在ios9.x显示正常了，算是临时解决了
1rpx实际被解析为.5px，应该ios平台的问题。加margin-left:1rpx不是解决的最好的办法。。emmmm