This repository has been archived on 2024-09-30. You can view files and clone it, but cannot push or open issues/pull-requests.
wxSmallApp/pages/home/home.wxss

44 lines
986 B
Plaintext

.page-body {
display: flex;
flex-direction: column;
}
.slide-image {
width: 100%;
height: 100%;
}
/* 四宫格布局样式 */
.grid-container {
display: flex;
justify-content: center;
}
.card {
width: 96%; /* 根据实际情况调整 */
height: 290rpx;
border-radius: 30rpx; /* 圆角大小 */
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); /* 阴影效果,根据需要调整 */
display: flex;
flex-wrap: wrap;
justify-content: space-around; /* 子项在主轴线上的对齐方式 */
margin: 20px 0; /* 卡片外边距 */
}
.grid-item {
width: 48%; /* 每个项目占据一行的48%,两列布局 */
text-align: center; /* 文本居中 */
margin-bottom: 20px; /* 底部外边距 */
margin-top: 20rpx;
}
.grid-item image {
width: 40rpx; /* 图像大小,根据需要调整 */
height: 40rpx;
margin-bottom: 5rpx; /* 图像与文本之间的间距,根据需要调整 */
}
.grid-item text {
display: block; /* 让文本独占一行 */
}