{"html":"\n\n\n\n\n\n\n\n","css":".button {\n cursor: pointer;\n width: 50px;\n height: 50px;\n border-radius: 50px;\n border: none;\n background: linear-gradient(120deg, #833ab4, #fd1d1d, #fcb045);\n position: relative;\n z-index: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-left: 10px;\n transition: 0.1s;\n}\n.button svg {\n color: white;\n width: 30px;\n height: 30px;\n z-index: 9;\n}\n\n.button:nth-child(3) {\n background: linear-gradient(120deg, #02ff2c, #008a12);\n}\n\n.button:nth-child(4) {\n background: rgb(69, 187, 255);\n}\n\n.button:nth-child(5) {\n background: rgb(255, 33, 33);\n}\n\n.button:nth-child(6) {\n background: black;\n}\n\n.button:active {\n transform: scale(0.85);\n}\n\n.button::before {\n content: \"\";\n position: absolute;\n width: 55px;\n height: 55px;\n background-color: #212121;\n border-radius: 50px;\n z-index: -1;\n border: 0px solid rgba(255, 255, 255, 0.411);\n transition: 0.4s;\n}\n\n.button:hover::before {\n width: 0px;\n height: 0px;\n}\n"}

smart-skunk-78

👁 实时预览

📝 源代码