一：grid的使用（ 平分宽度 ）

<template>
	<view class="">
		<view class="main">
			<view class="main-item">
				1
			</view>
			<view class="main-item">
				2
			</view>
			<view class="main-item">
				3
			</view>
			<view class="main-item">
				4
			</view>
		</view>
	</view>
</template>

<script>
</script>

<style>
	.main{
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 24px; /* 网格线之间的间距 */
	}
	.main-item{
		width: 100%;
		height: 200rpx;
		background: #ccc;
	}
</style>