/**index.wxss**/ page { overflow-x: hidden; overflow-y: scroll; display: flex; flex-direction: column; } .banner { display: flex; justify-content: center; align-items: center; padding: 24rpx 0 10rpx; } .banner .banner-item { border: 1px solid #dfefec; width: 100%; height: 310rpx; display: block; border-radius: 25rpx; } .banner .banner-item .bannerImg { width: 100%; height: auto; display:block; } .hot-bar, .hot-bar-1, .hot-bar-2 { padding: 14rpx 30rpx 10rpx; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: center; } .hot-bar .hot-image { width: 220rpx; height: 300rpx; } .brand-bar, .brand-bar-1, .brand-bar-2 { padding: 14rpx 30rpx 10rpx; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; } .brand-bar .brand-item { width: 120rpx; height: 120rpx; margin-bottom: 20rpx; } .brand-bar .brand-item .brand-image { width: 100%; height: 100%; } .slider { display: flex; justify-content: center; align-items: center; padding: 24rpx 0 10rpx; } .slider .slider-item { border: 1px solid #dfefec; width: 690rpx; height: 220rpx; display: block; border-radius: 25rpx; } .category, .category-1, .category-2 { position: relative; height: 300rpx; margin: 14rpx 30rpx 10rpx 30rpx; border: 1px solid #097561; background-color: #cdf3ec; border-radius: 25rpx; padding: 20rpx; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; transition: all 0.3s ease; } /* mini 模式的css */ .category.mini { position: fixed; /* 固定在页面顶部 */ z-index: 1000; height: 80rpx; padding: 0 20rpx; flex-wrap: nowrap; overflow-x: auto; } .category-1.mini { top: 0rpx; } .category-2.mini { top: 90rpx; } .category.mini .category-item { width: auto; height: 80rpx; margin: 0 20rpx; display: flex; align-items: center; } .category.mini .category-item .category-image { display: none; } .category.mini .category-item span { font-size: 28rpx; color: #097561; } /* mini 模式的css 结束 */ .category .category-item { width: 144rpx; height: 174rpx; margin-bottom: 0rpx; font-size: 28rpx; text-align: center; } .category .category-item .category-image { width: 100%; height: 124rpx; background-color: #57c6b1; }