20210828

css/exam_detail.css

@@ -63,3 +63,36 @@
 #toast .toast-content img {
   padding: 1px;
 }
+.new3 .body .exam-code {
+  margin: 30px 0;
+}
+.new3 .body .exam-code::before {
+  content: "更多参考答案，请下载大联考app；或者微信扫描，打开“大联考APP”小程序进行查看。";
+  text-align: center;
+  display: block;
+  color: #777;
+  padding-bottom: 10px;
+}
+.new3 .body .exam-code ul {
+  margin: 0;
+  padding: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  list-style: none;
+}
+.new3 .body .exam-code ul li ul {
+  display: block;
+  max-width: 200px;
+  max-height: 200px;
+  min-width: 100px;
+  min-height: 100px;
+  box-sizing: border-box;
+  padding: 20px;
+}
+.new3 .body .exam-code ul li ul li {
+  text-align: center;
+}
+.new3 .body .exam-code ul li ul li img {
+  width: 100%;
+}

css/exam_detail.less

@@ -0,0 +1,99 @@
+.new3 .body {
+  padding: 0 5px;
+  margin-top: 90px;
+}
+.new3 .body h4 {
+  font-weight: 500;
+}
+.new3 .body .title {
+  color: #777;
+  margin: 5px 0;
+}
+.new3 .body .list .list-flex {
+  margin: 10px  0;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+}
+.new3 .body .list .list-flex .list-item {
+  border-radius: 5px;
+  flex: 1;
+  padding: 10px;
+  margin-right: 20px;
+  box-shadow: 0 0 5px #d6d6d6;
+}
+.new3 .body .list .list-flex .list-item:hover {
+  cursor: pointer;
+}
+@media screen and (max-width: 768px) {
+  .new3 .body .list .list-flex .list-item {
+    margin-right: 5px;
+  }
+}
+.new3 .body .list .list-flex .list-item h4 {
+  font-weight: 600;
+}
+.new3 .body .list .list-flex .list-item .p {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.new3 .body .list .list-flex .list-item .p .blue {
+  color: #2382ff;
+}
+.new3 .body .list .list-flex .list-item .p a:hover {
+  color: #777;
+}
+.new3 .body .list .list-flex > .list-item:last-child {
+  margin: 0 0 0 20px;
+}
+@media screen and (max-width: 768px) {
+  .new3 .body .list .list-flex > .list-item:last-child {
+    margin: 0 0 0 5px;
+  }
+}
+.alert-msg {
+  margin: 10px 0;
+  padding: 10px;
+  background-color: #eee;
+  border-radius: 5px;
+  vertical-align: middle;
+  text-align: center;
+}
+#toast .toast-content img {
+  padding: 1px;
+}
+
+.new3 .body  .exam-code{
+  &::before{
+    content: "更多参考答案，请下载大联考app；或者微信扫描，打开“大联考APP”小程序进行查看。";
+    text-align: center;
+    display: block;
+    color: #777;
+    padding-bottom: 10px;
+  }
+  margin: 30px 0;
+  ul{
+    margin: 0;padding:0;
+    display: flex;justify-content: center;align-items: center;
+    list-style: none;
+    li{
+      ul{
+        display: block;
+        max-width: 200px;
+        max-height: 200px;
+        min-width: 100px;
+        min-height: 100px;
+        box-sizing: border-box;
+        padding: 20px;
+        li{
+          text-align: center;
+          img{
+           width: 100%;
+          }
+
+        }
+      }
+    }
+  }
+}

js/exam_detail.js

@@ -1,4 +1,20 @@
 $(function () {
+  $("#read").before(`<div class="exam-code">
+  <ul>
+    <li>
+      <ul>
+        <li><img src="../imgs/app_dowload.png" alt="大联考"></li>
+        <li>大联考APP下载</li>
+      </ul>
+    </li>
+    <li>
+      <ul>
+        <li><img src="../imgs/wx_code.jpg" alt="大联考"></li>
+        <li>"大联考APP"小程序</li>
+      </ul>
+    </li>
+  </ul>
+</div>`)
   let list_flex = $(".list .list-flex ");
   function href (e) {
     e.stopPropagation();