收藏
回答

小程序页面渲染出现一条细线

小程序页面渲染多了一条细线


test.wxml

<view class="ui-coupon">
    <view class="ui-coupon-container">
        <view class="ui-coupon-header"><view class="ui-coupon-row">文本一</view></view>
        <view class="ui-coupon-body"><view class="ui-coupon-row">文本二</view></view>
    </view>
</view>


test.wxss

.ui-coupon {
    color: #333;
    padding: 16px;
    min-height: 100vh;
    background-color: #63b359;
}
 
.ui-coupon-container {
    border: 0;
    outline: 0;
    overflow: hidden;
    border-radius: 8px;
    background-color: #fff;
}
 
.ui-coupon-header {
    position: relative;
}
 
.ui-coupon-header:before,
.ui-coupon-header:after {
    display: block;
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    bottom: -8px;
    background-color: #63b359;
}
 
.ui-coupon-header:before {
    left: -8px;
}
 
.ui-coupon-header:after {
    right: -8px;
}
 
.ui-coupon-row {
    color: #333;
    line-height: 24px;
    padding: 12px 25px;
    font-size: 16px;
    position: relative;
}
 
.ui-coupon-header .ui-coupon-row:before,
.ui-coupon-row + .ui-coupon-row:before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 0;
    display: block;
    content: '';
    border-top: 1px solid #d9d9d9;
 
    -webkit-transform: scaleY(.5);
    transform: scaleY(.5);
}
 
.ui-coupon-header .ui-coupon-row:before {
    top: auto;
    bottom: 0;
    left: 16px;
    right: 16px;
    border-top-style: dashed;
}


test.js 与 test.json 为创建时默认


然后,在开发者工具显示正常,但是手机预览时却多了一条灰色线




放大看仔细



最后一次编辑于  2018-01-22  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏投诉关注问题回答

4 个回答

  • Jake
    Jake
    2018-01-22

    我的安卓和苹果都没有这个线啊。是不是你的手机问题。你再检查一下是不是你页面设置什么东西。

    建议你写一个新的页面调试看看

    2018-01-22
    赞同
    回复
  • 连胜
    连胜
    2018-01-22

    建议你查看一下父元素的CSS,是否设置了box-shadow~

    如果没有设置,只是部分手机上有这问题,建议你把伪元素的大小设置大2rxp,然后改变right值,让这个半圈能盖住那条白线~

    2018-01-22
    赞同
    回复
  • Jon
    Jon
    2018-05-23

    我也有这个问题relative有条线, 不是 relative 这个线条就会消失。

    2018-05-23
    赞同
    回复
  • WANGCHEN
    WANGCHEN
    07-26

    那个放大镜 是什么软件截出来的

    07-26
    赞同
    回复