到实际

mock/main.ts

@@ -494,7 +494,7 @@ export default [
       return {
         "code": null,
         "data": {
-          "answers": ['选项选项选项选项选项选项选项选项选项选项a', "选项2", "选项3", "选项4"],
+          "answers": ['aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa', "选项2", "选项3", "选项4"],
           "avatar": null,
           "content": "题目题目题目题目题目题目题目题目题目题目题目题目题目题目题目题目题目题目题题目题目题目题目题目题目题目题目题目题目题目题目题目题目题目题目题目题目题目题目题目题目题目题目",
           "fullStrength": true,

src/panels/answerPanel/index.less

@@ -36,31 +36,42 @@
     position: absolute;
     top: 740px;
     left: 105px;
+    display: flex;
+    flex-direction: column;
+    row-gap: 20px;
 
     .answer-item {
-      width: 540px;
-      height: 80px;
+      width: 520px;
+      height: auto;
       text-align: left;
       color: rgb(88, 88, 88);
       font-size: 24px;
       font-weight: bold;
-      margin-bottom: 6px;
-      line-height: 80px;
-      padding-left: 10px;
-      .sparkBg("answerPanel/normalBg.png");
+      line-height: 1.5;
+      vertical-align: middle;
+      word-break: break-all;
+      background-color: #dbdbdb;
+      border: 1px solid #fff;
+      border-radius: 10px;
+      padding: 10px 15px;
+      // .sparkBg("answerPanel/normalBg.png");
       position: relative;
     }
 
-    .toolong {
-      line-height: 1.5;
-    }
+    // .toolong {
+    //   line-height: 1.5;
+    // }
 
     .error {
-      .sparkBg("answerPanel/errorBg.png");
+      color: #fff;
+      background-color: #e57174;
+      // .sparkBg("answerPanel/errorBg.png");
     }
 
     .correct {
-      .sparkBg("answerPanel/correctBg.png");
+      color: #fff;
+      background-color: #5eb272;
+      // .sparkBg("answerPanel/correctBg.png");
     }
 
     .correct-icon {
@@ -68,7 +79,7 @@
       position: absolute;
       width: 61px;
       height: 60px;
-      right: -10px;
+      right: 0px;
       top: -10px;
       .sparkBg("answerPanel/correctIcon.png");
     }
@@ -77,7 +88,7 @@
       position: absolute;
       width: 58px;
       height: 54px;
-      right: -10px;
+      right: 0px;
       top: -10px;
       display: inline-block;
       .sparkBg("answerPanel/errorIcon.png");