历史回顾-时代名称

src/views/HistoryNew.vue

@@ -17,6 +17,15 @@
         draggable="false"
       >
     </div>
+    <div class="stage-name">
+      <h1>开埠通商</h1>
+      <img
+        class="underline"
+        src="@/assets/images/underline-history-stage.png"
+        alt=""
+        draggable="false"
+      >
+    </div>
     <div
       class="time-axis-wrap"
       :style="{
@@ -296,6 +305,25 @@ export default {
       width: 100%;
     }
   }
+  >.stage-name {
+    position: absolute;
+    left: 50%;
+    top: 150px;
+    transform: translateX(-50%);
+    width: 250px;
+    text-align: center;
+    >h1{
+      font-size: 36px;
+      font-family: Source Han Sans CN-Bold, Source Han Sans CN;
+      font-weight: bold;
+      color: #FFFFFF;
+      line-height: 42px;
+    }
+    >img.underline{
+      margin-top: -20px;
+      width: 100%;
+    }
+  }
   >.time-axis-wrap{
     bottom: 32.4%;
     position: absolute;