page{ background-color: #F6F6F6; } .main{ .head{ position: fixed; z-index: 100; width: 100%; top: 0; left: 0; background: linear-gradient(405deg, #F4CECD 0%, #F6F1DC 100%); padding-bottom: 10px; .head_location{ display: flex; align-items: center; height: 45px; .location_img{ width: 18px; height: 18px; margin: 3px 5px 0 10px; } .location_title{ font-size: 28rpx; color: #000000; font-weight: 500; } .location_arrow_down{ width: 0; height: 0; border-left: 11rpx solid transparent; border-right: 11rpx solid transparent; border-top: 13rpx solid #000000; margin-left: 5px; margin-top: 3px; } } .head_search{ margin:0rpx 10px 0rpx 10px;; display: flex; align-items: center; background-color: #FFFFFF; height: 40px; border-radius: 50rpx; font-size: 28rpx; color: #000000; justify-content: space-between; .head_search_img{ width: 20px; height: 20px; margin-left: 13px; } .head_search_input{ width: 500rpx; height: 100%; margin-left: 10px; font-size: 26rpx; } .head_search_border{ height: 15px; width: 1px; background-color: #D9D9D9; } .head_search_btn{ width: 120rpx; height: 100%; display: flex; align-items: center; justify-content: center; } } } .grid_wrap{ padding: 20rpx 20rpx 20rpx 20rpx; display: flex; justify-content: space-between; background: linear-gradient(124deg, #F4CECD 0%, #F6F6F6 50%); // background: linear-gradient(405deg, #F4CECD 0%, #F6F1DC 100%); .grid_wrap_l{ width: 338rpx; height: 338rpx; background-color: #000000; border-radius: 20rpx; overflow: hidden; position: relative; .grid_wrap_live{ width: 338rpx; height: 338rpx; position: absolute; top: 0; z-index: 1; } .grid_wrap_live_title{ font-size: 30rpx; color: #FFFFFF; display: flex; z-index: 2; top: 20rpx; left: 20rpx; font-weight: 500; position: absolute; display: flex; align-items: center; .grid_wrap_live_img{ width: 28rpx; height: 28rpx; margin-right: 10rpx; } } } .grid_wrap_r{ width: 355rpx; .grid_wrap_li{ padding: 20rpx; width: 315rpx; height: 123rpx; background: #FFFFFF; border-radius: 17rpx 17rpx 17rpx 17rpx; display: flex; justify-content: space-between; align-items: center; box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(0, 0, 0, 0.05); .grid_wrap_li_l{ .grid_wrap_li_title{ font-size: 30rpx; color: #333333; font-weight: 500; display: flex; align-items: center; .grid_wrap_li_arrow{ width: 24rpx; height: 24rpx; margin-left: 10rpx; } } .grid_wrap_li_desc{ color: #999999; font-size: 24rpx; } } .grid_wrap_li_r{ width: 140rpx; height: 140rpx; } } .grid_wrap_top{ margin-top: 20rpx; } } } .scroll_view{ width: 100%; display: flex; overflow: hidden; white-space: nowrap; .typescoll{ .scroll_view_li{ width: 620rpx; background-color: #FFFFFF; border-radius: 20rpx; overflow: hidden; padding-bottom: 30rpx; display: inline-block; margin-left: 20rpx; box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(0, 0, 0, 0.05); .scroll_view_banner{ width: 100%; height: 340rpx; .scroll_view_bannerimg{ width: 100%; height: 340rpx; } } .scroll_view_shop{ padding: 30rpx 30rpx 0rpx 30rpx; display: flex; align-items: center; justify-content: space-between; .scroll_view_shop_l{ width:150rpx; height:150rpx; position: relative; .scroll_view_shop_no{ width: 32rpx; height: 45rpx; position: absolute; z-index: 2; top: 0; left: 0; } .scroll_view_shop_img{ width:150rpx; height:150rpx; position: absolute; z-index: 1; top: 0; } } .scroll_view_shop_r{ width: 385rpx; .scroll_view_shop_title{ font-size: 28rpx; color: #000000; font-weight: 500; .scroll_view_shop_desc{ color: #666666; font-size: 22rpx; font-weight: 400; } } .scroll_view_shop_tag{ display: flex; .scroll_view_shop_li{ border-radius: 6rpx 6rpx 6rpx 6rpx; border: 1rpx solid #FF6868; padding: 0rpx 10rpx 0rpx 10rpx; border-radius: 10rpx; color: #FF6868; font-size: 18rpx; margin-top: 10rpx; margin-right: 10rpx; } } .scroll_view_shop_bottom{ display: flex; align-items: center; justify-content: space-between; margin-top: 12rpx; .scroll_view_shop_price{ font-size: 34rpx; color: #FF0000; font-weight: 500; .market_name{ color: #999999; font-size: 24rpx; text-decoration: line-through; margin-left: 5rpx; font-weight: 400; } } .scroll_view_shop_cart{ width: 65rpx; height: 65rpx; display: flex; align-items: center; justify-content: center; .scroll_view_shop_cart_img{ width: 50rpx; height: 50rpx; } } } } } } } } } .price::before { content: '¥'; font-size: 24rpx; margin-right: 5rpx; } .prices::before { content: '¥'; font-size: 20rpx; margin-right: 5rpx; margin-left: 5rpx; }