vue去掉循环数组中的最后一组的某个样式style/class

vue去掉循环数组中的最后一组的某个样式style/class

需求:要实现这样的排列

现状

发现,最后一个格子并没有跟下面绿色线对齐。

最后发现 是因为 每个格子都给了 margin-right:36px,影响到了最后一个格子

所以要 将最后一个格子的margin 属性去掉

html 复制代码
  <div v-for="(item, index) in exportData.slice(3, 8)" :key="index">
      <div class="devicePart rectImg defaultrectImg"
:class="index === exportData.slice(3, 8).length - 1 ? '' : 'murightPart'">
        <div class="deviceTitle">{{ item.name.slice(0, 2) }}</div>
           <div class="deviceTitle">{{ item.name.slice(2, 5) }}</div>
       </div>
     </div>
 </div>

css

css 复制代码
 .muPart {
    display: flex;
  }

  .murightPart {
    margin-right: 36px;
  }
相关推荐
rising start5 小时前
四、CSS选择器(续)和三大特性
前端·css
Crystal32813 小时前
background属性经典应用(视觉差效果/绘制纸张/绘制棋盘)
前端·css
秦牛正威14 小时前
CSS的 white-space、word-break、overflow-wrap的用法
css
yong999015 小时前
响应式布局新利器:CSS Grid 的 grid-template-areas 实战
前端·css
inx17716 小时前
用纯 CSS 实现甜蜜亲吻动画:关键帧与伪元素的实战练习
前端·css
初遇你时动了情1 天前
css中backdrop-filter 详细使用 ios毛玻璃效果、filter和backdrop-filter使用说明
前端·css
谅望者1 天前
Flexbox vs Grid:先学哪一个?CSS 布局完全指南(附可视化示例)
前端·css·html·css3·css布局·css flexbox·css grid
listhi5201 天前
CSS:现代Web设计的不同技术
前端·css
自由日记1 天前
css属性使用手册
前端·css·html
znhy@1232 天前
CSS3属性(三)
前端·css·css3