.product-page{ width: 100%; height: calc(100vh-120px); min-height: 3076rpx; background: #F7FAFF; .p-banner{ margin: 20rpx 29rpx 0; .banner-item{ width: 690rpx; height: 432rpx; background-size: 690rpx 432rpx; } } .p-box{ margin:30rpx; width: 690rpx; height: 100%; background: #FFFFFF; box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(232,232,232,0.49); border-radius: 10rpx; .box-top{ display: flex; padding: 24rpx 0 30rpx 30rpx; .top-text{ width: 320rpx; font-family: PingFangSC, PingFang SC; font-weight: 500; font-size: 30rpx; color: #333333; line-height: 42rpx; text-align: left; font-style: normal; white-space: nowrap; /* 确保文本在一行内显示 */ overflow: hidden; /* 隐藏超出容器的内容 */ text-overflow: ellipsis; /* 使用省略号表示被截断的文本 */ word-break: break-all; /* 允许在单词内换行 */ } .top-btn{ margin-left:16rpx; width: 54rpx; height: 38rpx; border-radius: 5rpx; border: 1rpx solid #2263E6; font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 20rpx; color: #2263E6; line-height: 38rpx; text-align: center; font-style: normal; } } .box-footer{ padding: 30rpx 20rpx 32rpx 33rpx; display: flex; align-items: center; justify-content: space-between; font-family: PingFangSC, PingFang SC; font-weight: 400; .footer-l{ font-size: 56rpx; color: #FC4D3E; line-height: 56rpx; text-align: left; font-style: normal; text{ font-size: 40rpx; } } .footer-r{ font-size: 24rpx; color: #999999; line-height: 33rpx; text-align: left; font-style: normal; } } } .p-detail{ margin: 0 30rpx; padding-bottom: 130rpx; width: 690rpx; height: 100%; background: #FFFFFF; box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(232,232,232,0.49); border-radius: 10rpx; .det-text{ padding:25rpx; width: 639rpx; // height: 250rpx; font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 28rpx; color: #333333; line-height: 50rpx; text-align: left; font-style: normal; } .det-imglist{ display: flex; margin: 0 13rpx; // justify-content: space-between; flex-wrap: wrap; .list-item{ width: 332rpx; // height: 305rpx; .img-f{ width: 332rpx; height: 305rpx; background-size: 332rpx 305rpx; margin-bottom:20rpx; } } } } .p-footer{ position: fixed; bottom:0; width: 1000%; height: 140rpx; background: #FFFFFF; display: flex; align-items: center; .footer-l{ display: flex; margin:38rpx 76rpx 21rpx 40rpx; .l-attention{ .a-icon{ width: 40rpx; height: 40rpx; background: url('https://ddh.yyhock.com/ddhMall/attention.png') 0 0 no-repeat; background-size: 100%; } .a-icon-show{ margin-left:10rpx; width: 40rpx; height: 40rpx; background: url('https://ddh.yyhock.com/ddhMall/attention-show.png') 0 0 no-repeat; background-size: 100%; } .a-text{ padding-top:10rpx; height: 33rpx; font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 24rpx; color: #333333; line-height: 33rpx; text-align: center; font-style: normal; } .a-texts{ padding-top:10rpx; height: 33rpx; font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 24rpx; color:#FC4D3E; line-height: 33rpx; text-align: center; font-style: normal; } } .l-tel{ margin-left: 57rpx; .tel-icon{ width: 40rpx; height: 40rpx; background: url('https://ddh.yyhock.com/ddhMall/tel-icon.png') 0 0 no-repeat; background-size: 100%; } .tel-text{ padding-top:10rpx; height: 33rpx; font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 24rpx; color: #333333; line-height: 33rpx; text-align: center; font-style: normal; } } } .footer-r{ width: 451rpx; height: 95rpx; background: #2263E6; border-radius: 48rpx; font-family: PingFangSC, PingFang SC; font-weight: 500; font-size: 32rpx; color: #FFFFFF; line-height: 95rpx; text-align: center; font-style: normal; } } // 弹窗 .infrom-modal{ .modal-header{ display: flex; margin:0 31rpx; border-top: 1rpx solid #E9E9E9; .header-l{ margin-top: 21rpx; image{ width: 333rpx; height: 272rpx; background-size: 333rpx 272rpx; background: #9CA5B9; } } .header-r{ margin-top: 33rpx; margin-left: 35rpx; .r-prise{ height: 70rpx; font-family: PingFangSC, PingFang SC; font-weight: 500; font-size: 50rpx; color: #FC4D3E; line-height: 56rpx; text-align: left; font-style: normal; .prise-icon{ font-size: 40rpx; } } .r-num{ margin: 23rpx 0 34rpx; height: 40rpx; font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 28rpx; color: #999999; line-height: 40rpx; text-align: left; font-style: normal; } .r-text{ height: 42rpx; font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 30rpx; color: #333333; line-height: 42rpx; text-align: left; font-style: normal; } } } .modal-mian{ margin:33rpx 31rpx 0; padding-bottom:49rpx; border-top: 1rpx solid #E9E9E9; border-bottom: 1rpx solid #E9E9E9; .main-number{ margin-top:40rpx; display: flex; .number-text{ margin-left: 40rpx; padding-right: 40rpx; font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 30rpx; color: #333333; line-height: 42rpx; text-align: left; font-style: normal; } .number-line{ margin-left:42%; display: flex; .line-minus{ margin-top: 8rpx; width: 48rpx; height:48rpx; background: url('https://ddh.yyhock.com/ddhMall/minu-icon.png') 0 0 no-repeat; background-size: 100%; } .line-count{ margin: 8rpx 10rpx; width: 68rpx; height: 48rpx; background: #F1F2F3; font-size: 24rpx; font-family: PingFangSC-Semibold, PingFang SC; font-weight: 600; color: #212121; line-height: 48rpx; text-align: center; } .line-add{ margin-top: 8rpx; width: 48rpx; height: 48rpx; background: url('https://ddh.yyhock.com/ddhMall/add-icon.png') 0 0 no-repeat; background-size: 100%; } } } } .modal-btn{ margin:0 40rpx; position: fixed; bottom:10rpx; right: 0; width: 670rpx; height: 88rpx; background: linear-gradient( 137deg, #3877F5 0%, #5690FA 100%); border-radius: 44rpx; font-size: 32rpx; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #FFFFFF; line-height: 88rpx; text-align: center; } } }