/* 水平间距 */ /* 水平间距 */ .container.data-v-eea72321 { padding: 0 20rpx; min-height: 100vh; background-color: #f1f6fe; } .container .header.data-v-eea72321 { position: relative; width: 710rpx; height: 260rpx; text-align: end; } .container .header .header_img.data-v-eea72321 { margin-top: -24rpx; margin-right: -45rpx; width: 589rpx; height: 320rpx; } .container .header .user_photo.data-v-eea72321 { position: absolute; top: 80rpx; left: 20rpx; width: 120rpx; height: 120rpx; border-radius: 50%; } .container .header .user_name.data-v-eea72321 { position: absolute; top: 90rpx; left: 167rpx; font-size: 40rpx; font-weight: bold; } .container .header .user_grade.data-v-eea72321 { position: absolute; top: 160rpx; left: 167rpx; font-size: 24rpx; color: #666666; } .container .header .user_change.data-v-eea72321 { position: absolute; right: -20rpx; top: 80rpx; display: flex; justify-content: center; align-items: center; width: 171rpx; height: 67rpx; font-size: 24rpx; border-radius: 173rpx 0 0 173rpx; background-color: rgba(0, 97, 255, 0.05); } .container .header .user_change .img.data-v-eea72321 { margin-right: 10rpx; width: 29rpx; height: 29rpx; } .container .body.data-v-eea72321 { z-index: 1; position: relative; padding: 0 30rpx; border-radius: 8rpx; background-color: #fff; } .container .body .body_box.data-v-eea72321 { display: flex; align-items: center; height: 110rpx; } .container .body .body_box .box_img.data-v-eea72321 { width: 50rpx; height: 50rpx; border-radius: 50%; } .container .body .body_box .box_title.data-v-eea72321 { flex: 1; margin-left: 18rpx; font-size: 32rpx; } .container .body .body_box .box_icon.data-v-eea72321 { width: 31rpx; height: 31rpx; } .container .logout.data-v-eea72321 { position: absolute; bottom: 100rpx; display: flex; justify-content: center; align-items: center; width: 710rpx; height: 100rpx; font-size: 32rpx; border-radius: 8rpx; background-color: #fff; }