{"html":"

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n

\n","css":"/* Prior to using this loader, please ensure that you have set a background image or background color, as the text is transparent and not designed with a solid color. */\n.loader {\n --ANIMATION-DELAY-MULTIPLIER: 70ms;\n padding: 0;\n margin: 0;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n}\n.loader span {\n padding: 0;\n margin: 0;\n letter-spacing: -5rem;\n animation-delay: 0s;\n transform: translateY(4rem);\n animation: hideAndSeek 1s alternate infinite cubic-bezier(0.86, 0, 0.07, 1);\n}\n.loader .l {\n animation-delay: calc(var(--ANIMATION-DELAY-MULTIPLIER) * 0);\n}\n.loader .o {\n animation-delay: calc(var(--ANIMATION-DELAY-MULTIPLIER) * 1);\n}\n.loader .a {\n animation-delay: calc(var(--ANIMATION-DELAY-MULTIPLIER) * 2);\n}\n.loader .d {\n animation-delay: calc(var(--ANIMATION-DELAY-MULTIPLIER) * 3);\n}\n.loader .ispan {\n animation-delay: calc(var(--ANIMATION-DELAY-MULTIPLIER) * 4);\n}\n.loader .n {\n animation-delay: calc(var(--ANIMATION-DELAY-MULTIPLIER) * 5);\n}\n.loader .g {\n animation-delay: calc(var(--ANIMATION-DELAY-MULTIPLIER) * 6);\n}\n.letter {\n width: fit-content;\n height: 3rem;\n}\n.i {\n margin-inline: 5px;\n}\n@keyframes hideAndSeek {\n 0% {\n transform: translateY(4rem);\n }\n 100% {\n transform: translateY(0rem);\n }\n}\n"}

average-horse-18

👁 实时预览

📝 源代码