.common { height: 100vh; width: 100vw; background-image: url("https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/xhc/common/bgi.png"); /* 使用绝对路径 */ background-size: 100% 100%; /* 确保背景图片自适应填充整个容器 */ background-position: center; /* 背景图片居中显示 */ background-repeat: no-repeat; /* 防止背景图重复 */ overflow: auto; } .top-class { height: 5vh; } .head { height: 4vh; line-height: 4vh; } .body { height: calc(100vh - 160rpx); } .title { font-weight: bold; font-size: 40rpx; color: #FFFFFF; text-align: center; height: 6vh; line-height: 6vh; } .head { display: flex; justify-content: flex-end; } .logo-rules { height: 160rpx; width: 54rpx; display: block; margin-right: 20rpx; margin-top: 50rpx; } .logo-rules-2 { height: 160rpx; width: 54rpx; display: block; margin-right: 150rpx; margin-top: 50rpx; } .logo-text{ height: 60rpx; width: 140rpx; } .logo-container { display: flex; justify-content: center; align-items: center; margin: 20rpx 0; } .logo-container image { max-width: 100%; max-height: 100%; object-fit: contain; } .title-image { width: 600rpx; height: 100rpx; background-image: url(https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/xhc/common/textImg.png); background-size: contain; background-repeat: no-repeat; background-position: center; margin: 0 auto; } .title-image-2 { width: 500rpx; height: 70rpx; background-image: url(https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/xhc/common/textImg.png); background-size: contain; background-repeat: no-repeat; background-position: center; margin: 0 auto; } .footer-btn { position: fixed; /* 固定位置 */ left: 0; /* 距离页面左侧为0 */ bottom: 30rpx; /* 距离页面底部为0 */ width: 100%; /* 宽度为100%,确保按钮横跨整个底部 */ display: flex; /* 启用 Flexbox 布局 */ justify-content: center; /* 水平居中 */ align-items: center; /* 垂直居中 */ z-index: 999; /* 确保按钮在最上层 */ } .return-button { width: 120rpx; border: none; color: #000000; font-weight: 600; font-size: 26rpx; text-align: center; letter-spacing: 4rpx; /* 设置文字间距为2px */ font-weight: 600; height: 50rpx; line-height: 50rpx; border-radius: 8rpx; cursor: pointer; /* 鼠标指针效果 */ background: #FFBD70; border-radius: 20rpx; } .return_view { display: flex; justify-content: center; height: 30px; margin-top: 30rpx; } .content_text{ height: calc(100% - 80rpx); overflow: auto; margin-top: 30rpx; } .row-class { height: 80rpx; } .logo-img { background-size: cover; /* 确保背景图片自适应填充整个容器 */ background-position: center; /* 背景图片居中显示 */ background-repeat: no-repeat; /* 防止背景图重复 */ height: 100rpx; width: 62%; margin-right: 80rpx; } .commodity-img { background-size: cover; /* 确保背景图片自适应填充整个容器 */ background-position: center; /* 背景图片居中显示 */ background-repeat: no-repeat; /* 防止背景图重复 */ height: 72rpx; width: 100%; } .topImg{ display: flex; justify-content: center; margin-top: 120rpx; } .topImg .img_1{ height: 100rpx; margin-top: 20rpx; } .topImg .img_2{ height: 80rpx; } .cardTop{ margin-bottom: 10rpx; background-image: url("https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/cjx/title_bgi.png"); background-size: cover; background-position: center; background-repeat: no-repeat; height: 80rpx; margin-top: 40rpx; } .head-ttile { width: 100%; margin: 20rpx 0; text-align: center; /* 确保内容居中 */ position: relative; } .head-ttile-img { position: relative; width: 100%; display: flex; justify-content: center; align-items: center; } .ttile-img{ z-index: 1; height: 70rpx; width: auto; } .head-ttile-text { position: absolute; top: 8px; width: 100%; height: 100%; z-index: 2; color: #fff; font-size: 28rpx; font-weight: bold; text-align: center; } .img_3{ height: 240rpx; width: 460rpx; margin-top: -150rpx; } .content-index { margin-top: 8vh; } .content-2 { height: 62vh; padding: 10rpx 24rpx; overflow: auto; align-items: center; justify-content: center; background-image: url(https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/xhc/common/bgi_2.png); background-repeat: no-repeat; background-position: center; background-size: cover; margin: 3vh 40rpx 0rpx; } .content-title{ text-align: center; font-size: 30rpx; font-weight: 700; margin-top: 10rpx; }