Herramienta de embellecimiento HTML: formateador y embellecedor HTML gratuito en línea

Input data
bfotool loadding
Output data
bfotool loadding

Formateador HTML

Introduce tu HTML desordenado, minimizado u ofuscado en el campo superior para que se limpie y mejore. El editor superior también incluye útiles números de línea y resaltado de sintaxis. Hay muchas opciones para adaptar el embellecedor a tus preferencias de formato.

¿Cuándo se utiliza el visor HTML, el formateador HTML, el formateador HTML?

Al escribir HTML, la sangría, el espaciado y otros formatos pueden resultar algo desorganizados. Es común que varios desarrolladores trabajen en un mismo proyecto con diferentes técnicas de formato. Esta herramienta es útil para que el formato de un archivo sea consistente. También es común que el HTML se minimice u ofusque. Puedes usar esta herramienta para que el código se vea atractivo y legible, facilitando así su edición.

Ejemplos de formateador HTML

El HTML minimizado a continuación:

<nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <a class="navbar-brand" href="#">WebSiteName</a> </div><ul class="nav navbar-nav"> <li class="active"><a href="#">Home</a></li><li><a href="#">Page 1</a></li><li><a href="#">Page 2</a></li><li><a href="#">Page 3</a></li></ul> </div></nav>

Esto queda embellecido:

<nav class="navbar navbar-default">  
     <div class="container-fluid">  
         <div class="navbar-header"> <a class="navbar-brand" href="#">WebSiteName</a>   
         </div>  
         <ul class="nav navbar-nav">  
             <li class="active"><a href="#">Home</a>  
             </li>  
             <li><a href="#">Page 1</a>  
             </li>  
             <li><a href="#">Page 2</a>  
             </li>  
             <li><a href="#">Page 3</a>  
             </li>  
         </ul>  
     </div>  
 </nav>