收藏
回答

到底是 view 有问题还是我写的不正确


  <view class='data_box'>

    <view class='content_view' >

      <view class='text_box'>

        <view class='bottom_img_box'></view>

        <view class='text'>账单统计</view>

        <view class='second_text'>查看订单对应账单</view>

        <view class='arrow'></view>

      </view>

    </view>

    <view class='content_view'>

      <view class='text_box'>

        <view class='bottom_img_box'></view>

        <view class='text'>资料认证</view>

        <view class='second_text'>已认证</view>

        <!-- <view class='second_text'>未认证</view> -->

        <view class='arrow'></view>

      </view>

    </view>

    <view class='content_view'>

      <view class='text_box'>

        <view class='bottom_img_box'></view>

        <view class='text'>违章查询</view>

        <view class='second_text'>查询车辆违章信息</view>

        <view class='arrow'></view>

      </view>

    </view>

    <view class='content_view'>

      <view class='text_box'>

        <view class='bottom_img_box'></view>

        <view class='text'>联系客服</view>

        <view class='second_text'>

          <text space='nbsp'>400 100 8888</text>

        </view>

        <view class='arrow'></view>

      </view>

    </view>

  </view>



.data_box {

  width: 100%;

  height: 400rpx;

  margin-top: 21rpx;

  box-shadow: 0 3rpx 18rpx 0 rgba(0, 0, 0, 0.1);

  border-radius: 3rpx;

  background-color: #fff;

}

.content_view{

  width: 659rpx;

  height: 99rpx;

  margin-left: 31rpx;

  /* border: 1rpx solid white; */

}

.text_box{

  display:flex;

  width: 100%;

  height: 36rpx;

  text-align: center;

  margin: 30rpx 0 0 0;

  margin-top: 30rpx;

}

.bottom_img_box{

  width: 32rpx;

  height: 100%;

}

.text{

  width: 120rpx;

  line-height: 36rpx;

  font-size: 30rpx;

  text-align: center;

  margin-left: 16rpx;

  color: #333;

}

.second_text{

  width: 214rpx;

  line-height: 36rpx;

  font-size: 24rpx;

  color: #999;

  text-align: right;

  margin-left: 198rpx;

}

.arrow{

  width: 18rpx

  height: 30rpx;

  margin: 3rpx 0 0 28rpx;

  border: 1rpx solid red

}

为什么 把上面 css 中的 content_view 中的 boder 属性打开之后才会正常,注释之后就如图了,打开就正常了




回答关注问题邀请回答
收藏

1 个回答

  • Maverick
    Maverick
    2019-03-11

    你.text_box的上外边距和其父元素.content_view的上外边距折叠了,border会把它们的上外边距分开,你要去掉border的话,改用overflow: hidden也能起到同样的效果。

    2019-03-11
    有用
    回复
登录 后发表内容