Generador de menú acordeón CSS
Crea un menú acordeón en CSS puro, sin necesidad de JavaScript
도구를 불러오는 중…
🔒 Todo se procesa 100 % en tu navegador. Tus archivos y datos nunca se suben a ningún servidor.
Esta herramienta genera el código HTML y CSS de un menú acordeón en CSS puro, construido con el truco de checkbox/radio y sin usar JavaScript en absoluto. Resulta útil para desarrolladores y blogueros que necesitan una sección desplegable ligera y compatible con SEO para preguntas frecuentes o menús laterales, y toda la edición y generación de código ocurre en el navegador sin enviarse a ningún servidor.
Cómo usar
- Elige el modo de selección: apertura múltiple (checkbox) o apertura única (radio).
- Ajusta la velocidad de transición, el color de fondo del encabezado y el color del borde a tu gusto.
- Escribe el título y el contenido de cada sección del acordeón, y añade o elimina secciones según necesites.
- Revisa la vista previa en vivo y luego copia por separado el código HTML y el CSS generados.
Preguntas frecuentes
- ¿Funciona realmente sin JavaScript?
- Sí. Utiliza un input de checkbox/radio oculto junto con una etiqueta y selectores CSS de hermanos para alternar el estado abierto/cerrado.
- ¿Cuál es la diferencia entre apertura múltiple y única?
- La apertura múltiple (checkbox) permite tener varias secciones abiertas a la vez, mientras que la apertura única (radio) solo permite una sección abierta.
- ¿Puedo pegar el código generado en WordPress u otro CMS?
- Sí, pega el HTML y el CSS juntos en un bloque de código HTML y funcionará de la misma manera.