tigtools

HTML-formatering

Indsæt HTML for at indrykke det efter indlejringsniveau eller for at fjerne unødvendigt mellemrum. Koden behandles kun som tekst og gengives aldrig.

Kører i din browser Ingen tilmelding

Tilstand
Indrykning (mellemrum)

Indtast noget input for at se resultatet.

Sådan bruger du det

  1. Indsæt HTML i inputfeltet, åbn en .html-fil, eller prøv eksemplet.
  2. Vælg Beautify for indrykket, læsbar markup eller Minify for kompakt output.
  3. Når du bruger Beautify, skal du vælge 2 mellemrum, 4 mellemrum eller tabulatorer og bestemme, om kommentarer skal bevares.
  4. Kopier resultatet, eller download det som en .html-fil.

Sådan fungerer det

Formateringsværktøjet læser HTML'en med en tolerant tokenizer, ligesom en browser gør, og skriver den ud igen. Det gengiver aldrig inputtet, så scripts i den indsatte kode ikke kan køre, og der indlæses intet fra nettet.

Beautify placerer hvert blokelement (div, p, ul, li, section, table, …) på sin egen linje med indrykning efter indlejringsdybde. Tekst og inline-elementer som a, b, em, span, code, img og br forbliver sammen på én linje, så mellemrummene mellem ord og links ikke ændres på en måde, der påvirker den viste side. Serier af mellemrum og linjeskift i tekst bliver til ét mellemrum, hvilket alligevel er sådan browsere viser dem.

Indholdet af pre-, textarea-, script- og style-elementer kopieres nøjagtigt som skrevet, herunder mellemrum og eventuelle < eller >-tegn. Void-elementer som br, img, input, meta og link får aldrig et slut-tag. Selvlukkende tags som <path /> i inline SVG bevares selvlukkende.

Minify kollapser mellemrum i tekst til enkelte mellemrum, fjerner mellemrum ved siden af blokelementer, normaliserer mellemrummene mellem attributter og fjerner kommentarer, hvis “Behold kommentarer” er slået fra. Betingede kommentarer bevares altid.

Værktøjet retter ikke ugyldig HTML, tilføjer ikke manglende tags, omarrangerer ikke attributter og minificerer ikke CSS og JavaScript inden i style- og script-elementer. Elementer, der efterlades åbne, lukkes i slutningen af deres forældrelement, og et slut-tag uden et matchende start-tag bevares som skrevet.

Eksempler

Læs genereret markup

Et CMS genererer en skabelon som én lang linje. Formatering med 2 mellemrum viser nav-elementet, listeelementerne og hovedindholdet som et indrykket træ, mens “Priser inkluderer <strong>moms</strong>.” forbliver på én læselig linje.

Klargøring af en e-mail-skabelon

Minificér en HTML-e-mail med kommentarer slået fra for at reducere størrelsen. En <pre>-blok med en pristabel og det indlejrede <style>-element efterlades nøjagtigt, som de var.

Tjek strukturen

Når et afsluttende </div> mangler, viser det formaterede output de efterfølgende elementer indrykket ét niveau for dybt, hvilket gør det let at se, hvor elementet skulle være afsluttet.

Ofte stillede spørgsmål

Vil formatering ændre udseendet af min side?

I næsten alle tilfælde nej. Whitespace inde i blokelementer kollapser og omdannes til linjeskift, som browsere ignorerer. Tekst og inline-elementer forbliver på samme linje, og pre, textarea, script og style ændres ikke. Sider, der er afhængige af CSS white-space: pre på almindelige elementer, er undtagelsen.

Minificerer værktøjet CSS og JavaScript på siden?

Nej. Indholdet i script og style bevares nøjagtigt som skrevet, så det ikke kan gå i stykker. Brug CSS-formateringsværktøjet til at minificere et stylesheet separat.

Er det sikkert at indsætte HTML fra en ukendt kilde?

Ja. Indtastningen behandles udelukkende som tekst og indsættes aldrig i siden, så scripts ikke kører, og billeder eller links ikke indlæses.

Validerer det min HTML?

Nej. Værktøjet er bevidst tolerant og formaterer ødelagt markup i stedet for at afvise den. Uoverensstemmende lukketags bevares, så indrykningen hjælper dig med at opdage dem, men der oprettes ingen fejlliste.

Privatliv

Din HTML behandles kun i din browser og bliver aldrig gengivet eller uploadet. Intet gemmes eller medtages i statistik.