/* pages/shop/shop.wxss */ .container{ background-color: #F4F5F6; } .fenlei{ position: fixed; z-index: 999; color: white; background-color: #FA5151; border-radius: 0 0 24rpx 24rpx; padding: 20rpx 0; width: 100%; overflow-x: auto; } .fenlei .fl_scroll{ border-right: 1px solid #A1CECE; } .fl_scroll .fl_view{ display: flex; } .fl_view view{ min-width: 80rpx; height: 60rpx; padding: 0 30rpx; display: flex; align-items: center; justify-content: space-between; flex-direction: column; } .fl_view .xian{ width: 80rpx; height: 4rpx; background: #fff; border-radius: 4rpx; margin-top: 8rpx; } .content{ padding: 10rpx 30rpx 30rpx 30rpx; } .content .list{ display: flex; height: 168rpx; background: #FFFFFF; box-shadow: 0rpx 4rpx 15rpx 0rpx #E6E6E6; border-radius: 6rpx; padding: 24rpx; box-sizing: border-box; margin-bottom: 30rpx; } .list_left{ position: relative; width: 120rpx; height: 120rpx; margin-right: 25rpx; } .list_left image{ width: 100%; height: 100%; } .list_left view{ font-size: 24rpx; position: absolute; width: 100%; height: 100%; left: 0; top: 0; border-radius: 50%; background-color: rgba(0,0,0,0.5); color: #FFFFFF; } .list_right{ flex: 1; display: flex; flex-direction: column; } .list_right_top{ display: flex; align-items: center; justify-content: space-between; } .list_right_top_title{ font-size: 30rpx; color: #000000; } .list_right_top_btn{ display: flex; align-items: center; justify-content: center; font-size: 26rpx; line-height: 40rpx; width: 90rpx; height: 40rpx; border: 1px solid #fa5151; border-radius: 30rpx; color:#fa5151; box-sizing: border-box; } .list_right_bottom{ display: flex; justify-content: space-between; padding-right: 30rpx; } .bottom_item{ display: flex; flex-direction: column; align-items: center; margin-top: 24rpx; } .bottom_item view{ font-size: 26rpx; line-height: 22rpx; color: #fa5151; } .bottom_item text{ font-size: 24rpx; color: #888888; margin-top: 14rpx; }