.page-body { padding: 10rpx; /* 页面内容的内边距 */ background-color: #f8f8f8; /* 浅灰色背景 */ } .white-box { width: 90%; /* 宽度为父容器的 90% */ margin: 10rpx auto; /* 上下间距为 10rpx,水平居中 */ padding: 20rpx; /* 内边距 20rpx */ background-color: #fff; /* 背景颜色为白色 */ border-radius: 10rpx; /* 圆角效果 */ box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.1); /* 添加阴影效果 */ } .page-section-title { font-size: 30rpx; /* 标题字体大小 */ font-weight: bold; /* 字体加粗 */ color: #333; /* 字体颜色为深灰色 */ margin-bottom: 10rpx; /* 下边距 10rpx */ } /* 设置 radio-group 为横向布局 */ .radio-group { display: flex; justify-content: space-between; /* 使两个 radio 按钮左右分开 */ align-items: center; /* 垂直居中对齐 */ width: 100%; /* 确保 radio-group 容器占满整个宽度 */ } .radio { font-size: 28rpx; /* 单选框文本字体大小 */ color: #666; /* 字体颜色为浅灰色 */ margin: 5rpx 0; /* 上下间距 5rpx */ margin-left: 70rpx; /* 控制间距,使两个选项之间更紧凑 */ margin-right: 70rpx; /* 控制间距,使两个选项之间更紧凑 */ } .input-field { width: 100%; /* 输入框宽度为父容器的 100% */ padding: 10rpx; /* 内边距 10rpx */ font-size: 28rpx; /* 字体大小为 28rpx */ color: #000; /* 字体颜色为深灰色 */ border: none; /* 无边框 */ border-bottom: 1px solid #ddd; /* 底部边框为浅灰色 */ } .green-btn { margin-top: 20rpx; /* 上边距 20rpx */ text-align: center; /* 文本居中 */ } .btn { width: 80%; /* 按钮宽度为父容器的 80% */ padding: 15rpx 0; /* 上下内边距为 15rpx */ background-color: #00af92; /* 按钮背景颜色为绿色 */ color: #fff; /* 按钮文字颜色为白色 */ font-size: 28rpx; /* 字体大小为 28rpx */ border-radius: 10rpx; /* 按钮圆角效果 */ } .description-box { width: 90%; /* 白色框的宽度为父容器的 90% */ margin: 10rpx auto; /* 上下间距 10rpx,水平居中 */ padding: 15rpx; /* 增加文字周围空间 */ background-color: #fff; /* 背景为白色 */ } .bold-text { font-size: 32rpx; /* 加粗字体大小 */ color: #000; /* 黑色字体 */ } .description-box { width: 90%; /* 输入框宽度为父容器的 100% */ background-color: #f8f8f8; /* 浅灰色背景 */ } .bold-text { font-weight: bold; /* 加粗字体 */ font-size: 26rpx; /* 缩小字体大小 */ line-height: 1.5; /* 调整行高,使文本更加紧凑 */ color: #333; /* 字体颜色为深灰色 */ }