Formateador de HTML
Formatea fragmentos de HTML con este formateador de HTML. Pega el marcado y la herramienta coloca elementos de bloque como div, section, p, ul y table en líneas separadas con una indentación de dos espacios, reduce los espacios en blanco sobrantes del contenido en línea, formatea CSS y JavaScript en línea, y deja intacto el contenido de pre y textarea. Ideal para que desarrolladores web y diseñadores limpien marcado pegado, generado o minificado para facilitar su lectura y revisión.
Preguntas frecuentes
¿Cómo decide el formateador de HTML dónde separar las líneas?
Un elemento que contiene elementos secundarios de nivel de bloque, como div, section, article, header, footer, nav, main, form, p, h1 a h6, ul, ol, table o blockquote, se expande para que cada elemento secundario quede en su propia línea, con una indentación de dos espacios. Los elementos sin elementos secundarios de bloque permanecen en una sola línea.
¿Por qué mi documento completo de HTML aparece en una sola línea?
Según las reglas del formateador, los elementos html, head y body no son etiquetas de nivel de bloque, por lo que un documento que los incluya permanece en línea, salvo por el doctype. Pega el contenido dentro de body, o el fragmento con el que estés trabajando, para que se expanda.
¿Qué ocurre con los espacios en blanco?
Dentro del contenido en línea, las secuencias de espacios, tabulaciones y saltos de línea se reducen a un solo espacio, tal como los muestran los navegadores. El contenido de los elementos pre y textarea conserva exactamente sus espacios en blanco.
¿Se formatean los scripts y estilos en línea?
Sí, los bloques style se formatean como CSS y los bloques script como JavaScript, o como JSON para los tipos JSON y JSON-LD. Los scripts con otros tipos, como las plantillas de texto, se conservan exactamente como están escritos.
¿Cómo se escriben los elementos vacíos?
Las etiquetas autocerradas, como <br/>, se escriben con un espacio antes de la barra, como <br />. Los elementos vacíos escritos sin barra, como <img src="a.png">, conservan su forma original.
¿Se modifican los atributos?
No, los atributos, sus comillas y su orden se conservan exactamente como están escritos. Solo se reorganizan los espacios en blanco entre elementos.
¿Se conservan los comentarios?
Sí, se conservan los comentarios HTML y el doctype, y se colocan en líneas separadas. Su contenido se copia exactamente, incluido el marcado comentado.
¿El formateador corrige HTML no válido?
No, no valida ni repara el marcado. Las etiquetas sin cerrar se formatean lo mejor posible; ejecuta un validador cuando necesites encontrar errores estructurales.
¿Por qué el resultado está dentro de una valla de código html?
El resultado se devuelve en un bloque de código Markdown marcado como html, por lo que aparece resaltado en Markdown. Copia las líneas entre las vallas al pegarlo en un archivo .html.
¿Cuánto HTML puedo formatear?
Hasta 5 MB por ejecución; si la entrada es mayor, se rechaza y se muestra un mensaje. El resultado es idéntico al de la opción HTML del formateador de código.