.app { padding: 0; .scroll-Y { height: 790rpx; background-color: #F4F5F7; } .mask { .information { width: 70%; height: 400rpx; margin: 50% auto; background: #FFFFFF; border-radius: 30rpx; text-align: center; color: #FFFFFF; position: relative; .determine, .cancel { width: 200rpx; height: 70rpx; border-radius: 26rpx; font-size: 34rpx; line-height: 70rpx; position: absolute; top: 74%; } .determine { background: #4C7BC9; right: 36rpx; } .cancel { background: #C5BFBF; left: 36rpx; } .title { font-size: 42rpx; margin-top: 40rpx; color: #000000; } image { width: 100rpx; height: 100rpx; margin: 10% 0 0 0; } } } .mask { .PurchasePage { position: fixed; bottom: 0; height: 1150rpx; width: 100%; background: #FFFFFF; border-radius: 30rpx 30rpx 0px 0px; font-size: 36rpx; padding-bottom: 20rpx; .bodys { background-color: #FFFFFF; width: 96%; margin: 10rpx auto 0; border-radius: 20rpx; padding: 15rpx 0 20rpx; position: relative; .addressinfo { font-size: 32rpx; line-height: 65rpx; margin-left: 90rpx; image{ width: 40rpx; height: 50rpx; position: absolute; top:50%; left:20rpx; transform: translateY(-50%); } .address{ padding-top: 10rpx; width:92%; font-size: 30rpx; word-break:break-all; line-height: 45rpx; } .namephone{ width: 70%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .picture2 { position: absolute; top:50%; right:20rpx; transform: translateY(-50%); image { width: 18rpx; height: 18rpx; color: #FFFFFF; margin-left: 20rpx; } } } } .close { width: 31rpx; height: 31rpx; position: absolute; top: 2%; right: 2%; z-index: 999; } .topcontent { width: 96%; margin: 0 auto; padding-bottom: 15rpx; position: relative; .goodsStock{ font-size: 24rpx; position: absolute; top: 73%; left: 75%; } .price { color: #D43953; position: absolute; top: 70%; left: 37%; } .title { font-size: 36rpx; position: absolute; top: 3%; left: 38%; font-weight: 600; width: 58%; // height: 85rpx; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; word-break: break-all; } .image { width: 200rpx; height: 200rpx; margin: 15rpx 0 0 0; image { width: 201rpx; height: 201rpx; margin: 7rpx 0 0 7rpx; } } } .buy { width: 60%; height: 71rpx; background: #4C7BC9; color: #FFFFFF; text-align: center; line-height: 71rpx; border-radius: 26rpx; position: absolute; bottom:30rpx; left:20%; } .bottomcontent { margin-top: 10rpx; padding: 35rpx 0; background-color: #FFFFFF; border-radius: 15rpx; .chat { height: 130rpx; position: relative; span { font-size: 30rpx; position: absolute; left:130rpx; top:50%; transform: translateY(-50%); } image { position: absolute; left:30rpx; top:50%; transform: translateY(-50%); width: 65rpx; height: 55rpx; } } .header { font-size: 32rpx; display: inline-block; vertical-align: middle; margin-left: 17rpx; } .number { display: inline-block; position: absolute; right: 10%; } } .centercontent { font-size: 32rpx; background-color: #FFFFFF; margin-top: 10rpx; padding-top: 20rpx; border-radius: 20rpx; .header { margin-bottom: 20rpx; margin-left: 17rpx; } .productmodel { border: 4rpx solid #FFFFFF; } .Productmodel { background: #ECF1FA; border: 4rpx solid #4C7BC9; color: #4C7BC9; } .productmodel,.Productmodel{ background-color: #F6F6F6; height: 300rpx; text-align: center; width:30%; font-size: 24rpx; border-radius: 10rpx; margin: 5rpx 1.5% 10rpx; padding: 0 0 10rpx; view{ background-color: #F6F6F6; margin: 10rpx auto; width: 98%; // height: 90rpx; border-radius: 10rpx; font-size: 24rpx; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; } image{ border-radius: 10rpx; width: 100%; height: 200rpx; } } } } } .Purchasecolumn { width: 100%; height: 110rpx; background: #FFFFFF; position: fixed; bottom: 0; .buy { width: 263rpx; height: 80rpx; background: #4C7BC9; border-radius: 25rpx; font-size: 38rpx; color: #FFFFFF; line-height: 80rpx; text-align: center; position: absolute; right: 5%; top: 15rpx; } } .common { padding-left: 5%; } .choice, .Discount, .service { height: 80rpx; background: #FFFFFF; box-shadow: 0px 9px 31px 9px rgba(0, 0, 0, 0.03); font-size: 34rpx; line-height: 80rpx; margin-bottom: 15rpx; position: relative; image { width: 17rpx; height: 26rpx; position: absolute; right: 5%; top: 50%; transform: translateY(-50%); } .content { width: 65%; display: inline-block; position: absolute; left: 25%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; color: #000111; } .selected { color: #969394; display: inline-block; } } .picture { background: #FFFFFF; box-shadow: 0px 9px 31px 9px rgba(0, 0, 0, 0.03); position: relative; padding-bottom: 110rpx; .textInfo { word-break:break-all; font-size: 29rpx; text-indent: 2rem; line-height: 42rpx; // color: #666666; padding: 0 20rpx; /deep/ .richPic { width: 100% !important; height: 100% !important; } } .selected { padding: 20rpx 0 0 5%; color: #969394; display: inline-block; margin-bottom: 20rpx; } image { height: 750rpx; width: 100%; background-size: 100%; } } .service { height: 130rpx; line-height: 65rpx; .content { display: inline-block; position: absolute; left: 25%; } .selected { color: #969394; display: inline-block; } } .Commodity { background: #FFFFFF; margin: 15rpx 0 15rpx 0; box-shadow: 0rpx 9rpx 31rpx 9rpx rgba(0, 0, 0, 0.03); font-size: 36rpx; line-height: 60rpx; .name, .number { word-break: break-all; width: 100%; display: inline-block; line-height: 50rpx; } .price { color: #D43953; line-height: 70rpx; } .number { padding-left: 30rpx; } } }