.talk{ border-bottom: 1px solid #DDD; padding: 20rpx; background-color: #fff; } .talk:last-child{ border-bottom: none; } .talk-user, .user-info{ display: flex; justify-content: space-between; margin-bottom: 10rpx; } .user-info image{ width: 80rpx; height: 80rpx; margin-right: 20rpx; border-radius: 50%; } .good image{ width: 40rpx; height: 40rpx; margin-top: -8rpx; vertical-align: middle; } .name{ font-size: 32rpx; line-height: 50rpx; } .time{ font-size: 24rpx; color: #888; } .good text{ line-height: 80rpx; } .talk-content{ font-size: 30rpx; line-height: 40rpx; } .reply-container{ margin-bottom: 100rpx; } .reply{ padding: 20rpx; background-color: #fff; border-bottom: 1px solid #DDD; } .reply:last-child{ border-bottom: none; } .reply-content, .reply-reply{ padding-left: 100rpx; } .reply-content{ margin-bottom: 20rpx; } .photo-box{ width: 32%; height: 150rpx; overflow: hidden; display: inline-block; margin-right: 2%; text-align: center; position: relative; } .photo-box:nth-child(3n){ margin-right: 0; } .photo-more image{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: auto; } .click-good{ padding: 20rpx; margin: 20rpx 0; background-color: #fff; display: flex; justify-content: space-between; } .good-text{ text-align: center; width: 20%; } .good-text image{ width: 40rpx; height: 40rpx; } .good-count{ font-size: 24rpx; } .good-avatar{ width: 80%; } .good-avatar image{ width: 50rpx; height: 50rpx; margin: 12rpx 0 0 -15rpx; border: 1px solid #FFF; border-radius: 50%; } .good-avatar image:first-child{ margin-left: 0; } .reply .click-good{ background: none; } .edit-reply{ position: fixed; bottom: 0; left: 0; right: 0; padding: 20rpx; background-color: #fff; border-top: 1px solid #DDD; } .edit-reply input{ height: 60rpx; border-radius: 40rpx; background-color: #EEE; padding: 0 20rpx; } .video-box{ width: 65%; height: auto !important; } .video-box video{ width: 100%; } .reply-row{ line-height: 60rpx; background-color: #F7F7F7; padding: 0 10rpx; word-break: break-all; } .reply-row text{ font-weight: bold; } .photo-one{ width: 50%; height: auto; } .photo-one image{ max-width: 100%; } .photo-more image{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: auto; }