Přejít na obsah

Formátování HTML

Upravte kód HTML do přehledné podoby se správným odsazením.

Další možnosti
Běží v prohlížeči – vaše data se nikam neodesílají.

Jak použít

  1. Vložte kód do vstupního pole HTML.
  2. V nabídce Režim vyberte Formátovat.
  3. V nabídce Odsazení vyberte 2 mezery, 4 mezery nebo Tabulátor.
  4. Klikněte na Formátovat HTML nebo stiskněte Ctrl+Enter, na Macu Cmd+Enter.

Příklady

Zpřehlednění stránky s vloženým CSS

Vstup
<!doctype html><html lang="cs"><head><meta charset="utf-8"><title>Kavárna U Lípy</title><style>body{font-family:sans-serif}h1{color:#654321}</style></head><body><h1>Kavárna U Lípy</h1><p>Otevřeno denně od 8 do 18 hodin.</p></body></html>
Výstup
<!doctype html>
<html lang="cs">
    <head>
        <meta charset="utf-8">
        <title>Kavárna U Lípy</title>
        <style>
            body {
                font-family: sans-serif
            }

            h1 {
                color: #654321
            }
        </style>
    </head>
    <body>
        <h1>Kavárna U Lípy</h1>
        <p>Otevřeno denně od 8 do 18 hodin.</p>
    </body>
</html>

Rozdělení atributů formulářového pole

Vstup
<label for="email">E-mail pro potvrzení objednávky</label><input id="email" name="email" type="email" placeholder="jana@priklad.cz" autocomplete="email" required>
Výstup
<label for="email">E-mail pro potvrzení objednávky</label><input id="email"
  name="email"
  type="email"
  placeholder="jana@priklad.cz"
  autocomplete="email"
  required>

Minifikace e-mailu s komentářem pro Outlook

Vstup
<!-- Pracovní poznámka: podzimní nabídka -->
<div class="nabidka">
  <!--[if mso]><p>Podzimní nabídka pro zákazníky</p><![endif]-->
  <p>Milá Jano, <strong>děkujeme za objednávku.</strong></p>
</div>
Výstup
<div class="nabidka"><!--[if mso]><p>Podzimní nabídka pro zákazníky</p><![endif]--><p>Milá Jano, <strong>děkujeme za objednávku.</strong></p></div>

Časté dotazy

Odesílá se vložený HTML kód na server?

Formátování i minifikace probíhají ve vašem prohlížeči; nástroj HTML kód neodesílá na server ani ho neukládá. Ukládá se pouze nastavení voleb. Kód se zobrazuje jako text, takže se jeho skripty nespouštějí a obrázky nenačítají.

Najde nástroj chyby v HTML?

Upozorní na neuzavřené značky, uzavírací značky bez odpovídající otevírací značky a duplicitní atributy. Nejde o úplnou validaci HTML a varování nebrání vytvoření výsledku. Kliknutím na varování přejdete na příslušný řádek vstupu.

Mohu formátovat jen část HTML stránky?

Můžete vložit samotný úryvek, například navigaci nebo formulář. Nástroj k němu nepřidává obalové značky html ani body.

Proč se minifikace zastaví na chybě JavaScriptu?

Pokud vložený JavaScript nelze minifikovat, nástroj oznámí chybu s číslem řádku a ponechá předchozí výsledek beze změny. Opravte skript nebo vypněte Minifikovat vložené CSS a JS.