记录特别代码样式

csharp 复制代码
<view class="item-bottom">
<template v-for="(it, index) in item.train" >
			<image class="item-img-box" @click="preImg(item.train, index)" :key="index" v-show="index < 4" :src="it.fileDomain + it.filePath"></image>
		</template>
		<view v-if="item.train.length > 4" class="item-img-num" >
			<view>
				+{{ item.train.length - 4 }}
			</view>
		</view>
	</view>
scss 复制代码
.item-bottom {
	border-radius: 8rpx;
	display: flex;
	position: relative;
	&> .item-img-box:last-child {
		margin-right: unset;
	}
	.item-img-box {
		margin-right: 20rpx;
		width: 154rpx;
		height: 154rpx;
		border-radius: 6rpx;
		overflow: hidden;
		image {
			
			width: 100%;
			height: 100%;
		}
	}
	.item-img-num {
		position: absolute;
		border-radius: 6rpx;
		overflow: hidden;
		right: 6rpx;
		width: 154rpx;
		height: 154rpx;
		text-align: center;
		line-height: 154rpx;
		background-color: rgba(0,0,0,0.44);
		color: rgba(255,255,255,1);
	}
}
相关推荐
可爱的秋秋啊9 分钟前
简单网站编写
开发语言·前端
Keepreal49619 分钟前
Electron基本概念
前端·javascript·electron
zhaoolee36 分钟前
Claude Code使用指北(如何白嫖百万Qwen3 Token,每月劲省20刀)
前端
前台端水工程师39 分钟前
vite-plugin-mock插件的3.0.2版本在生产环境无法使用
前端
戈卬41 分钟前
VSCode 中 Prettier 工作原理与使用指南
前端
我叫张得帅44 分钟前
从零开始的前端异世界生活--005--“HTTP详细解析中”
前端
Whbbit199944 分钟前
在 Nestjs 中使用 Drizzle ORM
前端·javascript·nestjs
Never_Satisfied1 小时前
在JavaScript中,map方法使用指南
前端·javascript·vue.js
_码力全开_1 小时前
JavaScript从入门到实战 (1):JS 入门第一步:它是什么?能做什么?环境怎么搭?
开发语言·前端·javascript·新人首发
itslife1 小时前
vite 源码 - 执行 buildStart 钩子
前端·javascript