vue 代码样式问题

部分电脑存在样式错乱问题,部分电脑样式正常。最后发现是样式写在 el-col 里面导致的。

注意:写样式不要放在 el-row 或者 el-row ,导致部分电脑会出现莫名其妙的样式问题

<el-row class="detail">
  <el-col class="item flexColumnCenter" v-for="(item, index) in revenueItems" :key="index" :span="8">
      <div class="num">{{ item.num }}</div>
      <div class="unit">{{ item.unit }}</div>
      <img class="triangle" :src="item.triangleImageUrl" alt="" />
      <div class="imgBot">
        <img :src="item.imgSrc" alt="" />
      </div>
      <div class="label">{{ item.label }}</div>
  </el-col>
</el-row>

代码修改
<el-row class="detail">
  <el-col v-for="(item, index) in revenueItems" :key="index" :span="8">
    <div>
      <div class="num">{{ item.num }}</div>
      <div class="unit">{{ item.unit }}</div>
      <img class="triangle" :src="item.triangleImageUrl" alt="" />
      <div class="imgBot">
        <img :src="item.imgSrc" alt="" />
      </div>
      <div class="label">{{ item.label }}</div>
    </div>
  </el-col>
</el-row>

相关推荐

  1. Vue:多组件样式冲突问题解决

    2024-05-10 13:12:03       30 阅读
  2. vue 中的样式

    2024-05-10 13:12:03       7 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-05-10 13:12:03       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-05-10 13:12:03       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-05-10 13:12:03       19 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-05-10 13:12:03       20 阅读

热门阅读

  1. 周口电力乙级资质认证与企业长远发展规划

    2024-05-10 13:12:03       9 阅读
  2. [力扣题解] 216. 组合总和 III

    2024-05-10 13:12:03       12 阅读
  3. PostgreSQL的pg_dump和 pg_dumpall 异同点

    2024-05-10 13:12:03       14 阅读