HTML Beautify Tool- Ilmainen HTML-muotoilu- ja kaunistaja verkossa

Input data
bfotool loadding
Output data
bfotool loadding

HTML-muotoilija

Syötä sekava, minimoitu tai vaikeasti omaksuttu HTML-koodisi yllä olevaan kenttään, niin se siistitään ja kaunistetaan. Yllä oleva editori sisältää myös hyödyllisiä rivinumeroita ja syntaksin korostusta. Kaunistinta voi mukauttaa monin tavoin omien mieltymystesi mukaan.

Milloin käytät HTML-katseluohjelmaa, HTML-muotoilijaa ja HTML-muotoilijaa

HTML-koodia kirjoitettaessa sisennykset, välistykset ja muu muotoilu voivat usein olla hieman epäjärjestyksessä. On myös yleistä, että useat kehittäjät työskentelevät saman projektin parissa ja heillä on erilaiset muotoilutekniikat. Tämä työkalu on hyödyllinen tiedoston muotoilun yhdenmukaistamiseksi. On myös yleistä, että HTML-koodia pienennetään tai hämärretään. Voit käyttää tätä työkalua koodin näyttämiseen siistiltä ja luettavammalta, jotta sitä on helpompi muokata.

Esimerkkejä HTML-muotoilijasta

Alla oleva lyhennetty HTML-koodi:

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

Kaunistuu näin:

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