vant popup 中,写三个相同的div,中间有白色缝隙是为什么?

<template>
  <van-popup
    v-model="myShow"
    class="cp-coupon-dialog"
  >
    <div class="cp-coupon-dialog_header"></div>
    <div class="cp-coupon-dialog_list"></div>
    <div class="cp-coupon-dialog_footer"></div>
  </van-popup>
</template>
<script>
import { Popup } from 'vant'

export default {
  name: 'CpCouponDialog',
  components: {
    [Popup.name]: Popup,
  },


  props: {
    showObj: {
      type: Object,
      default: () => ({}),
    },

    value: {
      type: Boolean,
      default: false,
    },
  },

  data () {
    return {
      myShow: false,
    }
  },

}
</script>
<style lang="scss">
.cp-coupon-dialog {
  width: 578px;

  &_header {
    width: 578px;
    height: 182px;
    background-color: black;
  }

  &_list {
    width: 578px;
    height: 182px;
    background-color: black;
  }

  &_footer {
    width: 578px;
    height: 182px;
    background-color: black;
  }
}

</style>

代码如上,页面截图为
image.png

求解

阅读 1.5k
1 个回答

你用控制台查看一下吧,看下是边框还是伪类导致的

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题