Przejdź do treści

Formatowanie HTML

Uporządkuj kod HTML z poprawnymi wcięciami.

Więcej opcji
Działa w przeglądarce – Twoje dane nie są nigdzie wysyłane.

Jak używać

  1. Wklej kod do pola HTML.
  2. W opcji Tryb wybierz Formatuj lub Minifikuj.
  3. Dla trybu Formatuj ustaw Wcięcie, np. 2 spacje.
  4. Kliknij Formatuj HTML lub Minifikuj HTML albo naciśnij Ctrl+Enter (Cmd+Enter na Macu), aby otrzymać wynik.

Przykłady

Czytelny kod strony kawiarni

Dane wejściowe
<!doctype html><html lang="pl"><head><meta charset="utf-8"><title>Kawiarnia na Rynku</title><style>body{font-family:Arial,sans-serif}h1{color:#543}</style></head><body><h1>Kawiarnia na Rynku</h1><p>Zapraszamy codziennie od 8:00.</p></body></html>
Wynik
<!doctype html>
<html lang="pl">
    <head>
        <meta charset="utf-8">
        <title>Kawiarnia na Rynku</title>
        <style>
            body {
                font-family: Arial, sans-serif
            }

            h1 {
                color: #543
            }
        </style>
    </head>
    <body>
        <h1>Kawiarnia na Rynku</h1>
        <p>Zapraszamy codziennie od 8:00.</p>
    </body>
</html>

Atrybuty pola formularza w osobnych liniach

Dane wejściowe
<label for="email">Adres e-mail</label><input type="email" id="email" name="email" placeholder="jan.kowalski@example.pl" autocomplete="email" required>
Wynik
<label for="email">Adres e-mail</label><input type="email"
  id="email"
  name="email"
  placeholder="jan.kowalski@example.pl"
  autocomplete="email"
  required>

Minifikacja listy kategorii sklepu

Dane wejściowe
<html>
<head><title>Kategorie sklepu</title></head>
<body>
<!-- Menu kategorii -->
<ul class="kategorie">
  <li>Książki</li>
  <li>Gry planszowe</li>
</ul>
</body>
</html>
Wynik
<title>Kategorie sklepu</title><ul class=kategorie><li>Książki<li>Gry planszowe</ul>

FAQ

Czy formatowanie HTML zmienia czcionki i wygląd strony?

Narzędzie porządkuje zapis kodu: wcięcia i podział na linie. Nie ustawia czcionek ani stylów strony i nie pokazuje podglądu wyglądu. Do podglądu służy Podgląd HTML.

Czy narzędzie sprawdza poprawność kodu HTML?

Wskazuje niezamknięte znaczniki, znaczniki zamykające bez pasującego otwarcia i powtórzone atrybuty, podając numery linii. To nie jest pełna walidacja HTML. Ostrzeżenia nie blokują wyniku. Kliknij ostrzeżenie, aby przejść do wskazanej linii.

Czy mój kod HTML jest wysyłany na serwer?

Formatowanie i minifikacja odbywają się w przeglądarce, bez wysyłania kodu HTML na serwer. Narzędzie nie zapisuje HTML. Zapamiętuje tylko ustawienia opcji. Kod jest wyświetlany jako tekst, więc zawarte w nim skrypty nie są uruchamiane.

Dlaczego minifikacja nie działa dla osadzonego JavaScript?

Jeśli skryptu nie da się zminifikować, komunikat wskazuje linię błędu, a wynik nie jest aktualizowany. Popraw skrypt albo wyłącz Minifikuj osadzony CSS i JS.

Czy minifikacja usuwa komentarze warunkowe dla Outlooka?

Komentarze warunkowe Outlooka pozostają nawet przy włączonej opcji Usuń komentarze. Ta opcja usuwa zwykłe komentarze HTML.