HTML Beautify Tool – Gratis HTML-formaterare och förskönare online

Input data
bfotool loadding
Output data
bfotool loadding

HTML-formaterare

Ange din röriga, förminskade eller obfuskerade HTML i fältet ovan för att få den snyggare och snyggare. Redigeraren ovan innehåller också praktiska radnummer och syntaxmarkeringar. Det finns många alternativ för att skräddarsy förskönaren efter din personliga formateringspreferens.

När använder du HTML-visare, HTML-formaterare, HTML-formaterare

Ofta när du skriver HTML kan indrag, avstånd och annan formatering bli lite oorganiserad. Det är också vanligt att flera utvecklare arbetar på ett enda projekt med olika formateringstekniker. Det här verktyget är användbart för att göra formateringen av en fil konsekvent. Det är också vanligt att HTML minimeras eller obfuskeras. Du kan använda det här verktyget för att få koden att se snygg och läsbar ut så att den blir lättare att redigera.

Exempel på HTML-formatering

Den förminskade HTML-koden nedan:

<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>

Blir så här förskönad:

<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>