page{ background-color: #f6f6f6; } .main{ .head{ position: fixed; z-index: 100; width: 100%; top: 0; left: 0; background-color: #FFFFFF; border-bottom: 1rpx solid #f6f6f6; padding-bottom: 10px; .head_top{ display: flex; align-items: center; .head_back{ display: flex; align-items: center; border-radius: 50rpx; margin-left: 10px; .head_back_img{ display: block; width: 18px; height: 18px; margin-left: 7px; } } .head_search{ width: 210px; margin:0rpx 0px 0rpx 10px;; display: flex; align-items: center; background-color: #F6F6F6; height: 38px; border-radius: 50rpx; font-size: 28rpx; color: #000000; justify-content: space-between; .head_search_img{ width: 28px; height: 28px; margin-right: 13rpx; margin-left: 23rpx; } .head_search_input{ width: 500rpx; height: 100%; font-size: 27rpx; display: flex; align-items: center; } } } .head_list{ display: flex; justify-content:space-around; align-items:center; .head_item{ font-size: 28rpx; color: #333333; width: 200rpx; height: 20px; display: flex; align-items: center; justify-content: center; padding-top: 10px; } } } .cont{ // 商品区域样式 .cont_item{ margin: 20rpx 20rpx 0 20rpx; padding: 20rpx; background: #FFFFFF; border-radius: 16rpx; display: flex; align-items: center; justify-content: space-between; .item_imgUrl{ width: 200rpx; height: 200rpx; border-radius: 10rpx; } .item_r{ width: 450rpx; .item_title{ color: #333333; font-size: 28rpx; font-weight: 500; min-height: 80rpx; } .item_title text{ overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; word-break: break-all; } .item_desc{ font-size: 22rpx; color: #999999; margin-top: 10rpx; } .item_desc text{ overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; word-break: break-all; } .item_bottom{ display: flex; align-items: center; justify-content: space-between; margin-top: 20rpx; .item_price{ font-size: 32rpx; color: #FF0000; font-weight: 500; .item_otPrice{ font-size:26rpx; color: #999999; font-weight: 400; text-decoration: line-through; margin-left: 5rpx; } .item_otPrice::before{ content: "¥"; font-size: 20rpx; margin-right: 5rpx; } } .item_price::before{ content: "¥"; font-size: 24rpx; margin-right: 5rpx; } .item_addCart{ width: 48rpx; height: 48rpx; } } } } } .price::before { content: '¥'; font-size: 24rpx; margin-right: 5rpx; } .prices::before { content: '¥'; font-size: 20rpx; margin-right: 5rpx; margin-left: 5rpx; } .market_name{ color: #999999; font-size: 23rpx; text-decoration: line-through; margin-left: 5rpx; font-weight: 400; } } .load_desc{ font-size: 28rpx; color: #aaa; text-align: center; padding-top: 30rpx; padding-bottom: 30rpx; } .empty{ height:480rpx; margin:20rpx 20rpx 0rpx 20rpx; border-radius: 20rpx; display: flex; align-items: center; justify-content: center; .empty_cont{ .empty_cont_img{ margin: 0 auto; width: 355rpx; height: 280rpx; display: flex; } .empty_cont_title{ font-size: 28rpx; color: #aaaaaa; text-align: center; } .empty_cont_btn{ margin: 0 auto; width: 154rpx; height: 46rpx; border-radius: 30rpx; border: 1rpx solid #FF0000; color: #FF0000; line-height: 30rpx; display: flex; align-items: center; justify-content: center; margin-top: 40rpx; } } }