终端弹窗

src/components/body-d-right/threeR.vue

@@ -2,7 +2,10 @@
     <div>
         <public-title title="基层医疗点远程会诊"/>
         <div class="inner">
-
+            <div class="inner-item"></div>
+            <div class="inner-item"></div>
+            <div class="inner-item"></div>
+            <div class="inner-item"></div>
         </div>
     </div>
 </template>
@@ -11,8 +14,33 @@
 import PublicTitle from "../publicTitle.vue";
 </script>
 <style scoped lang="less">
-.inner {
+  .inner {
+    width: 100%;
     height: calc(100% - 40px);
-
-}
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-around;
+    align-content: space-around;
+    padding-top: 2%;
+    .inner-item{
+      width: 48%;
+      height: 46%;
+    }
+    .inner-item:nth-child(1){
+      background: url("../../assets/images/doctors1.png")no-repeat;
+      background-size: 100% 100%;
+    }
+    .inner-item:nth-child(2){
+      background: url("../../assets/images/doctors2.png")no-repeat;
+      background-size: 100% 100%;
+    }
+    .inner-item:nth-child(3){
+      background: url("../../assets/images/doctors3.png")no-repeat;
+      background-size: 100% 100%;
+    }
+    .inner-item:nth-child(4){
+      background: url("../../assets/images/doctors4.png")no-repeat;
+      background-size: 100% 100%;
+    }
+  }
 </style>