start

.gitignore

@@ -0,0 +1,2 @@
+
+dist

bottom.css

@@ -0,0 +1,121 @@
+#bottom{
+    position: relative;
+    width: 100%;
+    height: 19.5rem;
+    background: #17181D;
+    opacity: 1;
+    border-width: 0;
+    margin:0;
+}
+
+.decoration{
+    position:absolute;
+    /* top:255rem; */
+    top:-18.1rem;
+    right:0;
+}
+.decoration img{
+    width:70.6rem;
+}
+
+
+#fdage{
+    width:12rem;
+    height:3.2rem;
+}
+
+.info{
+    position:absolute;
+    left:12.7rem;
+    top:7.7rem;
+    font-size: 0.7rem;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    line-height: 19px;
+    color: #FFFFFF;
+    opacity: 0.7;
+}
+
+.support{
+    position:absolute;
+    left:0;
+    margin-top:1rem;
+}
+
+.bottom-qrcode{
+    position:absolute;
+    top:8.2rem;
+    left:31.9rem;
+    display: inline-block;
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+        -ms-flex-pack: justify;
+            justify-content: space-between;
+    width:10.1rem;
+    height:4.5rem;
+    opacity:1;
+}
+
+.aboutus{
+    position:absolute;
+    top:5.6rem;
+    left:45.7rem;
+}
+.line{
+    position:absolute;
+    top:7.2rem;
+    left:45.7rem;
+    width:42.2rem;
+    border:solid #4B4B4B 1px;
+}
+
+.box{
+    height:8rem;
+    margin-top:0.9rem;
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+    -webkit-flex-direction: column;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    -webkit-justify-content:space-around;
+        -ms-flex-pack:distribute;
+            justify-content:space-around;
+}
+.box a{
+    text-decoration: none;
+    color:inherit;
+}
+
+.box-extra1{
+    height:4.3rem;
+}
+
+.box-extra2{
+    height:2.7rem;
+}
+
+
+.info div:nth-child(1){
+    margin-bottom:0.4rem;
+    font-size: 0.8rem;
+}
+
+.operation{
+    position:absolute;
+    top:5.6rem;
+    left:67.4rem;
+}
+
+.explore{
+    position:absolute;
+    top:5.6rem;
+    left:82.6rem;
+}

exhibition.css

@@ -0,0 +1,239 @@
+#iframe-container{
+    width:100rem;
+    height:52.4rem;
+    position: relative;
+}
+
+#wanwuqiang{
+    position: absolute;
+    top:0;
+    left:0;
+    width:100%;
+    height:100%;
+    border-width: 0;;
+}
+
+
+
+.appear{
+    display: block;
+}
+
+.invisible{
+    visibility: hidden;
+}
+
+
+
+
+.exhibition{
+    position: absolute;
+    border-width: 0;
+    left:50%;
+    top:0;
+    -webkit-transform: translate(-50%);
+        -ms-transform: translate(-50%);
+            transform: translate(-50%);
+    width:100%;
+    height: 52rem;
+}
+
+
+.iframepng{
+    position:absolute;
+    top:0; left:0;
+    width:100%;
+    height:100%;
+}
+
+#caltural-relic-wall{
+    position: absolute;
+    top:8rem;
+    left:0;
+    width:100%;
+    height:55rem;
+    /* transform-origin: top left;
+    transform: scale(1,1); */
+}
+
+
+.img-title{
+    position:absolute;
+    top:4rem;
+    width:100rem;
+    display:-webkit-box;
+    display:-webkit-flex;
+    display:-ms-flexbox;
+    display:flex;
+    -webkit-box-pack: center;
+    -webkit-justify-content: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+}
+.ex{
+    top:7.9rem;
+}
+
+.tradition{
+    top:0;
+}
+
+
+
+.revolution{
+    top:52rem;
+}
+
+.nation{
+    top:103rem;
+    height:60rem;
+}
+div.ex-card{
+    margin:0 1.5rem 0;
+}
+
+
+.entitle{
+    position:absolute;
+    top:11rem;
+    left:50%;
+    -webkit-transform:translate(-50%);
+        -ms-transform:translate(-50%);
+            transform:translate(-50%);
+    height: 3.5rem;
+    font-size: 2.8rem;
+    font-family: STFangsong;
+    font-weight: 400;
+    line-height: 4.1rem;
+    color: #D06814;
+    /* opacity: 0.25; */
+}
+
+.wall{
+    top:7.9rem;
+    color: #ffffff;
+}
+
+.cards{
+    position:absolute;
+    top:17rem;
+    left:0;
+    width: 100%;
+    height:25rem;
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-pack: center;
+    -webkit-justify-content: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+    /* background-color: lightgray; */
+}
+
+.card{
+    overflow: hidden;
+    top:0;
+    width:18.3rem;
+    height:25.9rem;
+    margin:0 0.42rem 0;
+    /* background-color: lightblue; */
+    
+}
+
+.card:hover{
+    overflow: visible;
+    /* width: 19rem; */
+    /* transform: translate(-0.4rem,-0.4rem); */
+    
+    
+}
+.card:hover .img7{
+    /* width: 19rem; */
+    -webkit-transform:scale(1.03);
+        -ms-transform:scale(1.03);
+            transform:scale(1.03);
+    -webkit-transition: all 1s ease;
+    -o-transition: all 1s ease;
+    transition: all 1s ease;
+    -webkit-box-shadow: 0 3px 6px #000;
+            box-shadow: 0 3px 6px #000;
+}
+
+.img5{
+    width: 9rem;
+}
+
+.img6{
+    width:10.2rem;
+
+}
+
+.img7{
+    width:100%;
+    border-radius: 5px;
+
+}
+
+.control{
+    position:absolute;
+    top:26.7rem;
+    right:12.2rem;
+}
+
+.control:hover{
+    cursor: pointer;
+}
+
+img.control{
+    width:5.6rem;
+}
+
+.index{
+    position:absolute;
+    top:44.2rem;
+    width:100%;
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-pack: center;
+    -webkit-justify-content: center;
+        -ms-flex-pack: center;
+            justify-content: center;
+}
+
+.index div{
+    width:6px;
+    height:6px;
+    border:solid orange 1px;
+    border-radius: 5px;
+    margin:0 2px 0;
+}
+
+div.index_on{
+    width:9px;
+    background-color: orange;
+}
+
+div.disappear{
+    display: none;
+}
+
+
+
+
+#poster{
+    position:relative;
+    width: 100rem;
+    height:166rem;
+    margin:0;
+    border-width: 0;
+}
+
+.posterbackground{
+    position:absolute;
+    border-width: 0;
+    width:100%;
+}
+

images/glod.svg

@@ -0,0 +1,8 @@
+<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 827.21 476.52">
+<defs>
+<style>.cls-1{fill:#998c4e;}</style>
+</defs>
+<g id="蒙版组_84" data-name="蒙版组 84">
+<path id="交叉_1" data-name="交叉 1" class="cls-1" 
+d="M337.75,483C191.79,456.25,70,360.49,7.34,230.79V9.92a3.48,3.48,0,0,1,3.48-3.48H831.07a3.48,3.48,0,0,1,3.48,3.48V230.79C771.93,360.49,650.1,456.25,504.14,483Z" 
+transform="translate(-7.34 -6.44)"/></g></svg>

images/iframebackground.svg

@@ -0,0 +1,115 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="995.625" height="591.562" viewBox="0 0 995.625 591.562">
+  <defs>
+    <style>
+      .cls-1 {
+        opacity: 0.14;
+      }
+
+      .cls-1, .cls-2 {
+        fill: url(#linear-gradient);
+      }
+
+      .cls-3 {
+        clip-path: url(#clip-path);
+      }
+
+      .cls-4 {
+        opacity: 0.6;
+      }
+
+      .cls-5, .cls-7, .cls-8 {
+        fill: none;
+      }
+
+      .cls-5 {
+        stroke: #034c52;
+      }
+
+      .cls-6 {
+        opacity: 0.25;
+      }
+
+      .cls-7, .cls-8 {
+        stroke: #9c8e4f;
+      }
+
+      .cls-7 {
+        stroke-width: 41px;
+      }
+
+      .cls-9 {
+        clip-path: url(#clip-path-2);
+      }
+
+      .cls-10 {
+        fill: #9c8e4f;
+      }
+
+      .cls-11 {
+        filter: url(#交叉_1);
+      }
+
+      .cls-12 {
+        filter: url(#路径_1287);
+      }
+
+      .cls-13 {
+        filter: url(#矩形_339);
+      }
+    </style>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#d06814"/>
+      <stop offset="1" stop-color="#ffcdb2"/>
+    </linearGradient>
+    <filter id="矩形_339" x="-0.156" y="0" width="995.625" height="591.562" filterUnits="userSpaceOnUse">
+      <feOffset dy="3" input="SourceAlpha"/>
+      <feGaussianBlur stdDeviation="7.5" result="blur"/>
+      <feFlood flood-opacity="0.49"/>
+      <feComposite operator="in" in2="blur"/>
+      <feComposite in="SourceGraphic"/>
+    </filter>
+    <filter id="路径_1287" x="0" y="0" width="995.625" height="591.562" filterUnits="userSpaceOnUse">
+      <feOffset dy="3" input="SourceAlpha"/>
+      <feGaussianBlur stdDeviation="7.5" result="blur-2"/>
+      <feFlood flood-opacity="0.49"/>
+      <feComposite operator="in" in2="blur-2"/>
+      <feComposite in="SourceGraphic"/>
+    </filter>
+    <clipPath id="clip-path">
+      <rect id="矩形_318" data-name="矩形 318" class="cls-1" width="950.625" height="546.562" rx="4" transform="translate(484.688 1325.469)"/>
+    </clipPath>
+    <clipPath id="clip-path-2">
+      <g class="cls-13" transform="matrix(1, 0, 0, 1, 0, 0)">
+        <rect id="矩形_339-2" data-name="矩形 339" class="cls-2" width="950.625" height="546.562" rx="4" transform="translate(484.84 245.47)"/>
+      </g>
+    </clipPath>
+    <filter id="交叉_1" x="-7.864" y="-7.969" width="1010.417" height="607.5" filterUnits="userSpaceOnUse">
+      <feOffset dy="3" input="SourceAlpha"/>
+      <feGaussianBlur stdDeviation="10" result="blur-3"/>
+      <feFlood flood-color="#9c8e4f"/>
+      <feComposite operator="in" in2="blur-3"/>
+      <feComposite in="SourceGraphic"/>
+    </filter>
+  </defs>
+  <g id="组_497" data-name="组 497" transform="translate(-462.344 -225.969)">
+    <g class="cls-12" transform="matrix(1, 0, 0, 1, 462.34, 225.97)">
+      <path id="路径_1287-2" data-name="路径 1287" class="cls-2" d="M4,0H946.625a4,4,0,0,1,4,4V542.562a4,4,0,0,1-4,4H4a4,4,0,0,1-4-4V4A4,4,0,0,1,4,0Z" transform="translate(22.5 19.5)"/>
+    </g>
+    <g id="蒙版组_79" data-name="蒙版组 79" class="cls-3" transform="translate(-0.156 -1080)">
+      <g id="组_425" data-name="组 425" class="cls-4" transform="translate(432.609 881.219)">
+        <circle id="椭圆_1" data-name="椭圆 1" class="cls-5" cx="527.391" cy="527.391" r="527.391" transform="translate(0)"/>
+      </g>
+      <g id="组_426" data-name="组 426" class="cls-6" transform="translate(432.609 1071.359)">
+        <circle id="椭圆_1-2" data-name="椭圆 1" class="cls-7" cx="527.391" cy="527.391" r="527.391" transform="translate(0)"/>
+      </g>
+      <g id="组_427" data-name="组 427" class="cls-4" transform="translate(467.609 921.219)">
+        <circle id="椭圆_1-3" data-name="椭圆 1" class="cls-8" cx="544.695" cy="544.695" r="544.695" transform="translate(0)"/>
+      </g>
+    </g>
+    <g id="蒙版组_84" data-name="蒙版组 84" class="cls-9" transform="translate(-0.156)">
+      <g class="cls-11" transform="matrix(1, 0, 0, 1, 462.5, 225.97)">
+        <path id="交叉_1-2" data-name="交叉 1" class="cls-10" d="M317.087,547.5C149.389,516.8,9.413,406.784-62.533,257.762V4a4,4,0,0,1,4-4H883.884a4,4,0,0,1,4,4V257.758C815.938,406.78,675.961,516.8,508.264,547.5Z" transform="translate(84.67 19.03)"/>
+      </g>
+    </g>
+  </g>
+</svg>

images/marginpath.svg

@@ -0,0 +1,23 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="950.625" height="546.563" viewBox="0 0 950.625 546.563">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#d06814"/>
+      <stop offset="1" stop-color="#ffcdb2"/>
+    </linearGradient>
+    <filter id="矩形_339" x="-22.5" y="-19.5" width="995.625" height="591.563" filterUnits="userSpaceOnUse">
+      <feOffset dy="3" input="SourceAlpha"/>
+      <feGaussianBlur stdDeviation="7.5" result="blur"/>
+      <feFlood flood-opacity="0.49"/>
+      <feComposite operator="in" in2="blur"/>
+      <feComposite in="SourceGraphic"/>
+    </filter>
+    <clipPath id="clip-path">
+      <g transform="matrix(1, 0, 0, 1, 0, 0)" filter="url(#矩形_339)">
+        <rect id="矩形_339-2" data-name="矩形 339" width="950.625" height="546.562" rx="4" transform="translate(484.84 245.47)" fill="url(#linear-gradient)"/>
+      </g>
+    </clipPath>
+  </defs>
+  <g id="蒙版组_84" data-name="蒙版组 84" transform="translate(-484.844 -245.469)" clip-path="url(#clip-path)">
+    <path id="交叉_1" data-name="交叉 1" d="M317.087,547.5C149.389,516.8,9.413,406.784-62.533,257.762V4a4,4,0,0,1,4-4H883.884a4,4,0,0,1,4,4V257.758C815.938,406.78,675.961,516.8,508.264,547.5Z" transform="translate(547.168 245)" fill="#9c8e4f"/>
+  </g>
+</svg>