{"html":"","css":".share {\n display: flex;\n flex-direction: row;\n gap: 1em;\n transition: .4s ease-in-out;\n margin-top: 60px;\n}\n\n.btn1 {\n position: relative;\n width: 3em;\n height: 3em;\n outline: none;\n border: none;\n border-radius: 50%;\n background-color: white;\n transition: .4s all;\n}\n\n.btn1 .instagram {\n margin-top: 0.1em;\n fill: #cc39a4;\n}\n\n.btn1 .tooltiptext1 {\n visibility: hidden;\n width: 6em;\n height: 8em;\n background-color: whitesmoke;\n color: black;\n text-align: center;\n border-radius: 10px;\n padding: 1em;\n position: absolute;\n left: -1.5em;\n top: -8em;\n z-index: 1;\n transition: .1s ease-in-out;\n}\n\n.btn1 .tooltiptext1 .card {\n width: 4em;\n height: 4em;\n background-color: white;\n}\n\n.btn1 .tooltiptext1 .account {\n margin-top: 1em;\n}\n\n.btn1 .tooltiptext1 .username {\n font-size: 0.7em;\n margin-top: 1.6em;\n font-weight: bold;\n}\n\n.btn1:hover .tooltiptext1 {\n transform: translateY(-1em);\n visibility: visible;\n}\n\n.btn1:hover {\n background-color: #cc39a4;\n}\n\n.btn1:hover .instagram {\n fill: white;\n}\n\n.btn2 {\n position: relative;\n width: 3em;\n height: 3em;\n outline: none;\n border: none;\n border-radius: 50%;\n background-color: white;\n transition: .4s all;\n}\n\n.btn2 .twitter {\n margin-top: .25em;\n margin-left: .1em;\n fill: #03A9F4;\n}\n\n.btn2 .tooltiptext2 {\n visibility: hidden;\n width: 6em;\n height: 8em;\n background-color: whitesmoke;\n color: black;\n text-align: center;\n border-radius: 10px;\n padding: 1em;\n position: absolute;\n left: -1.5em;\n top: -8em;\n z-index: 1;\n transition: .1s ease-in-out;\n}\n\n.btn2 .tooltiptext2 .card {\n width: 4em;\n height: 4em;\n background-color: white;\n}\n\n.btn2 .tooltiptext2 .account {\n margin-top: 1em;\n}\n\n.btn2 .tooltiptext2 .username {\n font-size: 0.6em;\n margin-top: 1.6em;\n font-weight: bold;\n}\n\n.btn2:hover .tooltiptext2 {\n transform: translateY(-1em);\n visibility: visible;\n}\n\n.btn2:hover {\n background-color: #03A9F4;\n}\n\n.btn2:hover .twitter {\n fill: white;\n}\n\n.btn3 {\n position: relative;\n width: 3em;\n height: 3em;\n outline: none;\n border: none;\n border-radius: 50%;\n background-color: white;\n transition: .4s all;\n}\n\n.btn3 .tooltiptext3 {\n visibility: hidden;\n width: 6em;\n height: 8em;\n background-color: whitesmoke;\n color: black;\n text-align: center;\n border-radius: 10px;\n padding: 1em;\n position: absolute;\n left: -1.5em;\n top: -8em;\n z-index: 1;\n transition: .1s ease-in-out;\n}\n\n.btn3 .tooltiptext3 .card {\n width: 4em;\n height: 4em;\n background-color: white;\n}\n\n.btn3 .tooltiptext3 .account {\n margin-top: 1em;\n}\n\n.btn3 .tooltiptext3 .username {\n font-size: 0.7em;\n margin-top: 1.6em;\n font-weight: bold;\n}\n\n.btn3:hover .tooltiptext3 {\n transform: translateY(-1em);\n visibility: visible;\n}\n\n.btn3:hover {\n background-color: black;\n}\n\n.btn3:hover .git {\n fill: white;\n}"}

chilly-baboon-67

👁 实时预览

📝 源代码