Cómo funciona
Ordena y reindenta documentos HTML para que la jerarquía de etiquetas quede clara y consistente. Es ideal para desanidar marcado minificado, revisar plantillas ajenas o normalizar el estilo de tus vistas.
Además del tipo y tamaño de indentación y el fin de línea, permite controlar cómo se envuelven los atributos (por ejemplo, uno por línea) y el largo máximo de línea antes de aplicar salto, algo útil en etiquetas con muchos atributos.
Todo corre en tu navegador con js-beautify y respeta el contenido de bloques como pre y textarea. Formatea la presentación; no valida el HTML ni cierra etiquetas faltantes.
Ejemplos
<ul><li><a href="/a">A</a></li><li>B</li></ul><ul>
<li><a href="/a">A</a></li>
<li>B</li>
</ul>Cada elemento anidado pasa a su propia línea con la sangría correspondiente.Casos de uso
- Desanidar y hacer legible marcado HTML minificado de una página.
- Normalizar la indentación de plantillas antes de un commit.
- Controlar el ajuste de atributos en etiquetas con muchas propiedades.
- Revisar fragmentos de correo o newsletters con tablas anidadas.
Preguntas frecuentes
¿Qué hace la opción de ajuste de atributos?
Define cómo se distribuyen los atributos de una etiqueta: en la misma línea, forzados uno por línea o alineados. Es útil cuando un elemento tiene muchos atributos y querés mejorar la legibilidad.
¿Se rompe el contenido de pre o textarea?
No. El formateador respeta el contenido de etiquetas como pre y textarea, donde los espacios y saltos son significativos, y no los reindenta.
¿Valida o corrige el HTML?
No. Solo reordena la indentación y los saltos de línea. No comprueba que las etiquetas estén bien cerradas ni corrige errores de marcado.
¿Se sube mi código a un servidor?
No. Todo el formateo ocurre en tu navegador; el HTML nunca sale de tu equipo.