page { width: 100%; height: 100%; background: #f9f9f9; } .page { width: 100%; min-height: 100%; } .horizontal_nav { width: 100%; white-space: nowrap; overflow-x: scroll; height: 88rpx; background: rgba(61, 154, 248, 1); line-height: 88rpx; font-size: 28rpx; font-family: PingFang SC; font-weight: 400; color: rgba(174, 214, 255, 1); padding: 0 12rpx; box-sizing: border-box; } .horizontal_nav::-webkit-scrollbar { display: none; } .nav_item { padding: 0 40rpx; box-sizing: border-box; display: inline-block; } .nav_item.active { color: #fff; } .select_box { height: 88rpx; width: 100%; background: #fff; padding: 0 98rpx; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; } .select_item { font-size: 28rpx; font-family: PingFang SC; font-weight: 400; line-height: 40rpx; color: rgba(156, 156, 156, 1); position: relative; } .select_item.active { color: rgba(61, 154, 248, 1); } .select_item.active::after { content: ''; width: 100%; height: 4rpx; border-radius: 4rpx 4rpx 0 0; background: rgba(61, 154, 248, 1); position: absolute; bottom: -20rpx; left: 0; } .select_img { height: 22rpx; width: 10rpx; position: absolute; right: -14rpx; top: 50%; transform: translateY(-50%); display: flex; justify-content: center; align-items: center; } .select_img image { width: 100%; height: 100%; } .empty { font-size: 36rpx; font-family: PingFang SC; font-weight: 400; color: #ccc; margin: 200rpx auto 0; text-align: center; } .real_goods { width: 750rpx; margin: 0 auto; background: #f9f9f9; display: flex; flex-wrap: wrap; /* padding: 8rpx 11rpx 20rpx; */ box-sizing: border-box; } .real_goods_item { width: 367rpx; margin-top: 20rpx; border-radius: 10rpx; background: #fff; overflow: hidden; position: relative; display:flex; flex-direction: column; justify-content: center; align-items: center } .real_goods_item:nth-child(2n){ border-left:16rpx solid #f5f5f5; } .select_box { height: 88rpx; width: 100%; background: #fff; padding: 0 98rpx; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; } .select_item { font-size: 28rpx; font-family: PingFang SC; font-weight: 400; line-height: 40rpx; color: rgba(156, 156, 156, 1); position: relative; } .select_item.active { color: rgba(61, 154, 248, 1); } .select_item.active::after { content: ''; width: 100%; height: 4rpx; border-radius: 4rpx 4rpx 0 0; background: rgba(61, 154, 248, 1); position: absolute; bottom: -20rpx; left: 0; } .real_goods_img { width: 332rpx; height: 332rpx; margin-bottom: 16rpx; border-top-left-radius: 10rpx; border-top-right-radius: 10rpx; position: relative; } .real_goods_img{ margin-left:10rpx; } .real_goods_img image { width: 100%; height: 100%; } .tip { width: 87rpx !important; height: 80rpx !important; position: absolute; right: 0; top: 0; z-index: 2; } .real_goods_bottom { width:335rpx; padding: 16rpx 16rpx 28rpx 31rpx; box-sizing: border-box; background: #fff; } .goods_title { font-size: 26rpx; font-family: PingFang SC; font-weight: 500; line-height: 36rpx; color: rgba(5, 9, 26, 1); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .goods_flex { height: 50rpx; display: flex; align-items: center; } .score { width: 64rpx; height: 32rpx; background: rgba(242, 0, 0, 1); border-radius: 2rpx; text-align: center; color: #fff; font-size: 22rpx; font-family: PingFang SC; font-weight: 400; margin-right: 12rpx; } .price { font-size: 36rpx; font-family: PingFang SC; font-weight: bold; color: rgba(242, 0, 0, 1); margin-right: 20rpx; } .sell { font-size: 20rpx; font-family: PingFang SC; font-weight: 400; color: rgba(156, 156, 156, 1); } .pink_cover{ width: 100%; height: 100%; background: #ccc; opacity: 0.3; position: absolute; left: 0; top: 0; } .goodimgbox{ display:flex; flex-direction: column; justify-content: center; align-items: center } .huaxianprice{ color:#999; text-decoration: line-through; font-size: 26rpx; }