{"html":"

III

UIVERSE PREMIUM FONT (REGULAR)

\n \n

-50%

\n","css":".card {\n width: 190px;\n height: 254px;\n background: #f5f5f5;\n padding: 15px;\n border-radius: 10px;\n overflow: hidden;\n transition: all 0.3s;\n position: relative;\n}\n.wrapper {\n height: fit-content;\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 15px;\n}\n.card-image {\n width: 100%;\n height: 170px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 5em;\n font-weight: 900;\n transition: all 0.3s;\n}\n.content {\n height: fit-content;\n display: flex;\n align-items: flex-start;\n justify-content: center;\n}\n.title {\n font-size: 0.72em;\n text-transform: uppercase;\n font-weight: 500;\n color: #4d4d4d;\n}\n.price {\n font-size: 1em;\n font-weight: 700;\n}\n.old-price {\n font-size: 0.7em;\n text-decoration: line-through;\n color: #adadad;\n}\n.card-btn {\n margin-top: 10px;\n width: 100%;\n height: 40px;\n background-color: rgb(24, 24, 24);\n border: none;\n border-radius: 40px;\n color: white;\n transition: all 0.3s;\n cursor: pointer;\n font-weight: 500;\n}\n.card:hover .card-image {\n height: 120px;\n}\n.card:hover .card-btn {\n margin-top: 0;\n}\n.card-btn:hover {\n background-color: greenyellow;\n color: rgb(35, 35, 35);\n}\n.card:hover {\n background-color: white;\n}\n\n.tag {\n position: absolute;\n background-color: greenyellow;\n color: rgb(0, 0, 0);\n left: 12px;\n top: 12px;\n padding: 6px 12px;\n border-radius: 15px;\n font-size: 0.75em;\n font-weight: 500;\n}\n"}

tender-fireant-6

👁 实时预览

📝 源代码