{"html":"

\n \n \n Section 1\n

\n \n \n \n

\n \n

This is the content for Section 1.

\n\n

\n \n \n Section 2\n

\n \n \n \n

\n \n

This is the content for Section 2.

\n \n \n Section 3\n

\n \n \n \n

\n \n

This is the content for Section 3.

\n","css":".accordion {\n width: 300px;\n margin: 0 auto;\n}\n\n.accordion-item {\n margin-bottom: 5px;\n}\n\n.accordion-item .content {\n font-size: 12px;\n}\n\n.accordion input[type=\"radio\"] {\n display: none;\n}\n\n.accordion .content {\n height: 0px;\n padding: 0px;\n background-color: #fafafa;\n border-top: 1px solid #ccc;\n overflow: hidden;\n transition: all 0.3s ease;\n}\n.accordion input[type=\"radio\"]:checked + .accordion-header + .content {\n height: auto;\n padding: 15px;\n}\n.accordion-icon {\n display: flex;\n align-items: center;\n transition: all 0.5s ease;\n}\n.accordion input[type=\"radio\"]:checked + .accordion-header .accordion-icon {\n transform: rotate(180deg);\n}\n.accordion-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 8px;\n background-color: #f1f1f1;\n cursor: pointer;\n font-weight: bold;\n text-align: left;\n}\n.accordion-header .accordion-title {\n font-size: 14px;\n}\n"}

curly-rabbit-26

👁 实时预览

📝 源代码