样式修改

common/styles/global/components.scss

@@ -8,6 +8,9 @@ view{box-sizing: border-box;}
 .ezy-tc{text-align: center;}
 .ezy-tr{text-align: right;}
 
+/***** 状态栏 *****/
+.phone-status-bar{height: var(--status-bar-height);width: 100%;}
+
 /***** 超出省略 *****/
 // 文本超出省略号显示 (一行)
 @mixin single-line-ellipsis() {text-overflow: ellipsis;overflow: hidden;word-wrap: break-word;white-space: nowrap;word-break: break-all;}
@@ -41,7 +44,7 @@ view{box-sizing: border-box;}
 // 三个元素
 .phone-navBar-box{
 	display: flex;align-items: center;justify-content: space-between;background-color: #fff;
-	padding: 0 20rpx 20rpx;box-sizing: border-box;position: relative;
+	padding: var(--status-bar-height) 20rpx 20rpx;box-sizing: border-box;position: relative;
 	.nav-bar-icon{
 		width: 24rpx;height: 38rpx;
 		background-image: url("@/static/images/common/nav-bar-jt.svg");@include ezy-no-repeat-cover();
@@ -58,12 +61,12 @@ view{box-sizing: border-box;}
 // 两个元素
 .icon-title-navBar-box,.icon-title-bjcolor-navBar-box{
 	display: flex;align-items: center;justify-content: center;background-color: #fff;
-	padding: 0 20rpx 20rpx;box-sizing: border-box;position: relative;
+	padding: var(--status-bar-height) 20rpx 20rpx;box-sizing: border-box;position: relative;
 	.nav-bar-title{
 		font-size: 36rpx;height: 63rpx;line-height: 63rpx;color: #333;max-width: 70%;
 	}
 	.nav-bar-icon{
-		width: 24rpx;height: 38rpx;position: absolute;left: 24rpx;top: 12rpx;
+		width: 24rpx;height: 38rpx;position: absolute;left: 24rpx;top: calc(12rpx + var(--status-bar-height));;
 		background-image: url("@/static/images/common/nav-bar-jt.svg");@include ezy-no-repeat-cover();
 	}
 }
@@ -96,6 +99,12 @@ background-color: #3fd2a1;
 		border-radius: 40rpx;
 	}
 }
+
+// 前面带线的标题
+.phone-line-title {display: block;color: #333;font-size: 36rpx;line-height: 1;}
+.phone-line-title:before{content: ' ';width: 4rpx;height: 36rpx;background-color:#3fd2a1;
+margin-right: 18rpx;display: inline-block;vertical-align: middle;}
+
 /***** 试题---题干 *****/
 .phone-shiti-question{
 	font-size: 32rpx;color: #333;line-height: 1.6;margin-bottom: 24rpx;

common/styles/global/pages.scss

@@ -95,6 +95,26 @@
 	}
 }
 
+/*** 答题解析***/
+.phone-question-answer-box{
+	font-size: 30rpx;color: #666;box-sizing: border-box;padding: 32rpx;
+	line-height: 1.6;max-height: 60vh;overflow: auto;
+	.phone-line-title{margin-bottom: 24rpx;}
+	.btdf-row{
+		margin-bottom: 10rpx;
+		text{color: #3fd2a1;margin-right: 6rpx;}
+	}
+	.ndda-row{
+		min-width: 50%;display: inline-block;margin-bottom: 10rpx;
+		
+		text{color: #ff6b67;}
+	}
+	.zqda-row{
+		min-width: 50%;display: inline-block;margin-bottom: 10rpx;
+		text{color: #3fd2a1;}
+	}
+}
+
 /*** 家政页面***/
 .jiazheng-search-box{
 	width: 100%;box-sizing: border-box;padding: 20rpx 20rpx;position: relative;

components/scoreAndAnswer/scoreAndAnswerAdmin.vue

@@ -1,10 +1,11 @@
 <template>
 	<uni-popup ref="popupRef" background-color="#fff" >
-		<view class="question-score-answer-admin">
-			<view>本体得分: <text>{{data.score}}分</text></view>
-			<view>您的答案：<text>{{data.reply}}</text></view>
-			<view>正确答案： <text>{{data.result}}</text></view>
-			<view>答案解析: 
+		<view class="phone-question-answer-box">
+			<view class="phone-line-title">答案解析</view>
+			<view class="btdf-row">本题得分：<text>{{data.score}}</text>分</view>
+			<view class="zqda-row">正确答案：<text>{{data.result}}</text></view>
+			<view class="ndda-row">您的答案：<text>{{data.reply}}</text></view>
+			<view class="dajx-row">答案解析: 
 				<rich-text :nodes="data.answer"></rich-text>
 			</view>
 		</view>