添加顶部背景渐变遮罩

src/views/map3d.vue

@@ -1,5 +1,6 @@
 <template>
   <div id="app">
+    <div class="bg_top"></div>
     <div class="header">
       <div class="timeline">
         <div class="timeline-item" v-html="formattedText"></div>
@@ -281,7 +282,17 @@ export default {
   height: calc(100% - 60px);
   top: 60px;
 }
-
+.bg_top {
+  width: 100%;
+  height: 70px;
+  position: absolute;
+  z-index: 100;
+  background: linear-gradient(
+    to bottom ,
+    rgba(6, 37, 66, 1),
+    rgba(26, 28, 53, 0)
+  );
+}
 .header {
   height: 60px;
   position: fixed;