{"html":"

Title

\n
\n

Lorem Ipsum is simply dummy text of the printing and typesetting industry.\n

\n \n \n

","css":".card {\n width: 190px;\n height: 254px;\n padding: 2%;\n background: rgb(255, 255, 255);\n border-bottom: 2px solid blueviolet;\n border-right: 2px solid blueviolet;\n border-top: 2px solid white;\n border-left: 2px solid white;\n transition-duration: 1s;\n transition-property: border-top, \n border-left, \n border-bottom,\n border-right,\n box-shadow;\n}\n\n.card:hover {\n border-top: 2px solid blueviolet;\n border-left: 2px solid blueviolet;\n border-bottom: 2px solid rgb(238, 103, 238);\n border-right: 2px solid rgb(238, 103, 238);\n box-shadow: rgba(240, 46, 170, 0.4) 5px 5px, rgba(240, 46, 170, 0.3) 10px 10px, rgba(240, 46, 170, 0.2) 15px 15px, rgba(240, 46, 170, 0.1) 20px 20px, rgba(240, 46, 170, 0.05) 25px 25px;\n}\n\n.card__content {\n font-size: small;\n text-align: center;\n}\n\n.card__content-heading {\n color: blueviolet;\n}\n\n.card__content-body p {\n color: rgb(118, 104, 128);\n padding-bottom: 1rem;\n}\n\n.card__content-footer button {\n background-color: rgb(255, 255, 255);\n color: grey;\n font-weight: 700;\n border-radius: .2rem;\n border: 1px solid grey;\n padding: .5rem;\n margin: 1rem;\n transition-duration: 1s;\n transition-property: background-color, color, border;\n}\n\nbutton:hover {\n color: white;\n background-color: rgb(238, 103, 238);\n border: 1px solid white;\n box-shadow: rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em;\n}\n\n\n"}

hard-firefox-84

👁 实时预览

📝 源代码