css flex布局 justify-content: space-between 最后两张居左

比如如果是8张,最后两张两边对齐,第八张最后一张 放个占位符就OK了

<div class="previewPadding flex" >

<div class="picList picList3" v-for="(item,index) in picDataList" :key="index">

<img class="pic" :src="item.pic" />

</div>

<div v-if="picDataList.length == 8" class="picList picList3" ></div>

</div>

.flex{

display: flex;

justify-content: space-between;

flex-wrap: wrap;

.picList{

width:49%;

}

.picList3{

width:32%;

//margin-right: 3%;

}

}

相关推荐
胡耀超2 小时前
Web Crawling 网络爬虫全景:技术体系、反爬对抗与全链路成本分析
前端·爬虫·python·网络爬虫·数据采集·逆向工程·反爬虫
阿明的小蝴蝶2 小时前
记一次Gradle环境的编译问题与解决
android·前端·gradle
Ruihong2 小时前
【VuReact】轻松实现 Vue 到 React 路由适配
前端·react.js
山_雨2 小时前
startViewTransition
前端
写代码的【黑咖啡】2 小时前
Python Web 开发新宠:FastAPI 全面指南
前端·python·fastapi
凉_橙2 小时前
gitlab CICD
前端
wangfpp2 小时前
性能优化,请先停手:为什么我劝你别上来就搞优化?
前端·javascript·面试
踩着两条虫2 小时前
AI 驱动的 Vue3 应用开发平台 深入探究(二十):CLI与工具链之构建配置与Vite集成
前端·vue.js·ai编程
凉_橙2 小时前
前端项目与node项目部署记录
前端
踩着两条虫2 小时前
AI 驱动的 Vue3 应用开发平台 深入探究(二十):CLI与工具链之自定义构建插件
前端·vue.js·ai编程