body { /* background-image: url(bg.jpg)!important; background-color: #b9c8cf; background-size: cover; background-position: center center; background-repeat: no-repeat; */ background-color: #ecffea; transition: background-color 1s ease-in-out; } .l{ position: fixed; top: 0; left: 0; right: 0; bottom: 0; /* transform: translate(0, 40%); */ /* transform: translate(0, 47%); */ /* color: #fff; */ /* background-color: #b68dc2; */ text-align: center; /* line-height: 100vh; */ /* height: 100vh; width: 100vw; */ display: flex; justify-content: center; align-items: center; /* animation: l 5s; animation-fill-mode: forwards; */ /* background: linear-gradient(83deg, black, #161414); */ /* background: linear-gradient(135deg, rgb(0 173 255) 0%, rgb(198 142 40) 51%, rgb(0 0 0) 100%); */ /* background-image: url(/bg.webp); background-size: cover; background-position: center center; background-repeat: no-repeat; */ } /* latin */ @font-face { font-family: 'Fredoka One'; font-style: normal; font-weight: 400; font-display: swap; src: url(f1.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } .l-t { /* font-size: 5em; */ /* background: linear-gradient(180deg, white 50%, #000); */ padding: 1em 0; /* -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; */ animation: l-t 5s; animation-fill-mode: forwards; font-size: 3em; color: #2d2d2d; font-family: 'Fredoka One', sans-serif; /* text-shadow: 0.25rem -0.25rem rgb(16 255 0 / 75%), -0.25rem -0.25rem rgb(69 251 175), 0 0.5rem rgb(71 68 255); */ text-shadow: 0.25rem -0.25rem rgb(16 255 0 / 75%), -0.25rem -0.25rem rgb(69 251 175), 0 0.1rem rgb(71 68 255); } @media all and (min-width: 768px) { .l-t { font-size: 5em; } } @keyframes l { from { background: linear-gradient(0deg, black, #1e1e1e); } to { background: linear-gradient(360deg, black, #1e1e1e) } } @keyframes l-t { from { letter-spacing: 1em; transform: scale(1); /* font-size: 5em; */ } to { letter-spacing: 0.3em; transform: scale(1.5); /* font-size: 7em; */ } } #root { position: fixed; /* position: absolute; */ top: 0; left: 0; right: 0; bottom: 0; /* width: 100vw; */ /* height: 100vh; */ background-color: #b68dc2; /* background-image: url(/bg.webp); */ /* 相当于更快的预加载图片 */ background-size: cover; background-position: center center; background-repeat: no-repeat; overflow: auto; }