body{ margin: 0; background: #333; } #title{ position: absolute; width: 40%; height: 10%; top: 0; left: 30%; color: white; font-size: 35px; display: flex; align-items: center; justify-content: center; text-align: center; } #tim{ position: absolute; height: 5%; top: 5%; right: 2%; background: transparent; font-size: 20px; } #c1{ position: absolute; width: 40%; height: 30%; top: 10%; left: 30%; color: white; } .num{ width: 25%; float: left; display: flex; align-items: center; justify-content: center; color: gold; font-size: 20px; } .txt{ width: 25%; float: left; font-family: "幼圆"; display: flex; align-items: center; justify-content: center; } .txt h2{ margin: 0; } #c2{ position: absolute; width: 40%; height: 60%; top: 40%; left: 30%; /*background: #888888;*/ } #l1{ position: absolute; width: 30%; height: 45%; top: 10%; left: 0; /*background: #999999;*/ } #container{ position: absolute; padding-top: 15px; width: 30%; height: 45%; top: 55%; left: 0; /*background: #353;*/ overflow: hidden; } #l2{ /*position: absolute;*/ text-align: center; display: flex; width: 100%; height: 20%; /*top: 0;*/ /*left: 0;*/ /*background: #777;*/ overflow: hidden; mask-image: linear-gradient( 90deg, transparent, #fff 20%, #fff 80%, transparent ); } #l2 div{ white-space: nowrap; animation: animate var(--t) linear infinite; } #l2 div:nth-child(2){ animation: animate2 var(--t) linear infinite; animation-delay: calc(var(--t)/ -2); } @keyframes animate { from{ transform: translate(100%); } to{ transform: translate(-100%); } } @keyframes animate2 { from{ transform: translate(0); } to{ transform: translate(-200%); } } #l2 div span{ display: inline-flex; margin: 10px; letter-spacing: .2em; background-color: #504d4d; color: #fff; padding: 5px 10px; border-radius: 5px; } #r1{ position: absolute; /*padding-bottom: 10px;*/ width: 30%; /*height: 45%;*/ height: 371px; top: 10%; left: 70%; /*background: #8888;*/ } #r2{ position: absolute; width: 30%; height: 45%; top: 55%; left: 70%; /*background: #444;*/ } #wordCloudImage{ width: 100%; height: auto; max-width: 100%; }