crowd-test-service-frontend/src/pages/UserCenter/BankCard.vue

<template>
  <div class="bank-card">
    <div class="bank-card-title" style="padding: 10px;height:43px">
      <img src="../../assets/img/bankimg.png">
      <span class="" style="font-size: 16px;font-weight: bold;line-height: 43px">建设银行</span>
      <el-button type="primary" plain class="pull-right" size="mini">编辑</el-button>
    </div>
    <div class="bank-card-detail-wrapper">
      <div class="bank-card-detail">
        <div class="bank-card-detail-info">张晓楠</div>
        <div class="bank-card-detail-info">********************5656</div>
      </div>
    </div>
  </div>

</template>

<script>
  export default {
    name: "BankCard",
    data(){
      return {
        addBankCard:false,

      }
    }
  }
</script>

<style scoped lang="less">
  .bank-card {
    /*width:285px;*/
    height:160px;
    background:rgba(255,255,255,1);
    box-shadow:0px 1px 6px 0px rgba(8,6,6,0.13);
    .bank-card-detail-wrapper {
      padding: 10px;
      .bank-card-detail{
        margin-bottom: 5px;
        .bank-card-detail-title {
          font-size: 14px;
        }
        .bank-card-detail-info {
          margin-left: 43px;
        }
      }
    }
  }
</style>