hjyd-mobile/src/components/detail/Intro.vue

<template>
  <div class="case_detail_intro">
    <div class="wrap" v-for="(item, index) in cardIntro" :key="index">
      <div class="title">
        <div class="xuhao">{{ parseInt(index) + 1 }}</div>
        <p>{{ item.title }}</p>
      </div>
      <div class="desc">{{ item.desc }}</div>
    </div>
  </div>
</template>

<script setup>
const props = defineProps({
  cardIntro: Array,
})
</script>

<style lang="scss" scoped>
.case_detail_intro {
  padding: 20px;
  zoom: 0.6;
  .wrap {
    margin-bottom: 10px;
    .title {
      display: flex;
      align-items: center;
      font-size: 10px;
      font-family: Alibaba PuHuiTi;
      font-weight: bold;
      color: #000000;
      margin-bottom: 7px;
      .xuhao {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        border: solid 1px #000;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-right: 6px;
      }
    }
    .desc {
      font-size: 8px;
      letter-spacing: 2px;
      line-height: 20px;
      font-family: Alibaba PuHuiTi;
      font-weight: 300;
      color: #aaaaaa;
    }
  }
}
</style>