TanodTools
PL

Formatowanie HTML

Wklej zabałaganiony lub zminifikowany HTML i odbierz go z wcięciami, także z uporządkowanymi skryptami i stylami wewnątrz strony.

Działa w całości w Twojej przeglądarce

Wcięcie
Zawartość

Dane wejściowe do ok. 10 MB. Narzędzie tylko poprawia wcięcia i nigdy nie odrzuca kodu, więc nie powie, czy HTML jest niepoprawny.

Jak sformatować HTML

  1. Wklej HTML do pola albo kliknij Wstaw przykład.
  2. Wybierz wcięcie, ewentualnie długość zawijania wierszy oraz to, czy skrypty <script> i style <style> w treści mają być formatowane.
  3. Uporządkowana wersja pojawia się poniżej podczas pisania. Skopiuj ją lub pobierz jako plik .html.

Bezpieczne wcinanie kodu HTML

Przeglądarki scalają większość białych znaków w HTML, więc stronę można zapisać w jednym wierszu albo rozłożyć na tysiąc i wyświetli się tak samo. Szablony, wyniki z CMS-ów i zminifikowane paczki często dają kod, którego nikt nie jest w stanie przeczytać. Formater umieszcza elementy blokowe w osobnych wierszach i wcina elementy potomne pod rodzicami, dzięki czemu niedopasowane lub źle umieszczone znaczniki łatwo zauważyć.

Diabeł tkwi w szczegółach, na których formatery się potykają. Puste elementy, takie jak <br>, <img> i <input>, nigdy nie mają znacznika zamykającego, więc nie mogą zwiększać wcięcia. Białe znaki wewnątrz <pre> i <textarea> są wyświetlane tak, jak je wpisano, więc nie wolno ich ruszać. Elementy liniowe dzielą wiersz z otaczającymi je słowami, bo podział wiersza w tym miejscu dodałby widoczną spację.

Skrypty i arkusze stylów osadzone na stronie to osobny język. Formater może rozłożyć je z wcięciem takim jak na reszcie strony albo zostawić bez zmian, jeśli wolisz zachować mały diff lub kod jest już celowo zminifikowany.

Wskazówki

  • Chcesz zmniejszyć arkusz stylów? Minifikuj i upiększaj CSS działa na samodzielnym CSS.
  • Konwertujesz fragment na Markdown do pliku README? Użyj narzędzia HTML na Markdown.
  • Przeglądasz zmianę w szablonie? Sformatuj starą i nową wersję, a potem porównaj je w narzędziu Porównaj teksty.

Najczęstsze pytania

Czy mój HTML jest przesyłany?

Nie. Biblioteka formatująca jest ładowana z tej strony przy pierwszym wklejeniu, a kod jest przetwarzany wyłącznie w Twojej przeglądarce.

Czy zmienia to wygląd strony?

Zmienia białe znaki między znacznikami, które przeglądarki w większości i tak scalają, więc strona powinna wyglądać tak samo. Wyjątkiem są białe znaki widoczne na stronie: dlatego tekst wewnątrz <pre> i <textarea> zostaje dokładnie taki, jak go wpisano.

Czy powie mi, że mój HTML jest uszkodzony?

Nie. Formatuje łagodnie i niczego nie odrzuca, więc niezamknięty znacznik nie wywoła błędu; wcięcia po prostu podążają za tym, co zostanie znalezione. Błędy strukturalne wykryjesz walidatorem.

A co z JavaScriptem i CSS na stronie?

Domyślnie zawartość <script> i <style> jest formatowana tym samym wcięciem. Odznacz opcję Formatuj skrypty i style w treści, aby zostawić je dokładnie tak, jak napisano.

Jak traktowane są znaczniki liniowe, takie jak span i a?

Elementy liniowe zostają w tym samym wierszu co ich tekst, o ile się mieści, więc zdanie ze znacznikiem <strong> nie jest łamane na osobne wiersze, co dodałoby widoczne spacje.

Co robi zawijanie długich wierszy?

Po ustawieniu długości zawijania tekst wykraczający poza limit jest przenoszony do nowego wiersza na granicy słowa. Opcja Wyłączone zostawia każdy fragment tekstu w jednym wierszu, bez względu na długość.