tigtools

HTML-formaterer

Lim inn HTML for å rykke det inn etter nestingsnivå eller for å fjerne unødvendig mellomrom. Koden behandles kun som tekst og gjengis aldri.

Kjører i nettleseren din Ingen registrering

Modus
Innrykk (mellomrom)

Skriv inn noe for å se resultatet.

Slik bruker du det

  1. Lim inn HTML i inndatafeltet, åpne en .html-fil eller prøv eksemplet.
  2. Velg Beautify for innrykket, lesbar kode eller Minify for kompakt resultat.
  3. Når du formaterer pent, velg 2 mellomrom, 4 mellomrom eller tabulator, og angi om kommentarer skal beholdes.
  4. Kopier resultatet eller last det ned som en .html-fil.

Slik fungerer det

Formatoren leser HTML-en med en tolerant tokenizer, omtrent som en nettleser gjør, og skriver den ut igjen. Den gjengir aldri inndataene, så skript i innlimt kode kan ikke kjøres, og ingenting lastes inn fra nettet.

Beautify setter hvert blokkelement (div, p, ul, li, section, table, …) på egen linje, med innrykk etter nøstedybden. Tekst og inline-elementer som a, b, em, span, code, img og br holdes sammen på én linje, slik at mellomrommene mellom ord og lenker ikke endres på en måte som påvirker den gjengitte siden. Serier av mellomrom og linjeskift i tekst blir ett enkelt mellomrom, slik nettlesere viser dem uansett.

Innholdet i pre-, textarea-, script- og style-elementer kopieres nøyaktig slik det er skrevet, inkludert mellomrom og eventuelle < eller >-tegn. Tomme elementer som br, img, input, meta og link får aldri en slutt-tagg. Selvlukkende tagger som <path /> i innebygd SVG beholdes selvlukkende.

Minify slår sammen mellomrom i tekst til enkle mellomrom, fjerner mellomrom inntil blokkelementer, normaliserer mellomrommene mellom attributter og, hvis «Behold kommentarer» er av, fjerner kommentarer. Betingede kommentarer beholdes alltid.

Verktøyet fikser ikke ugyldig HTML, legger ikke til manglende tagger, omorganiserer ikke attributter og minifiserer ikke CSS-en og JavaScript-en inne i style- og script-elementer. Elementer som står åpne, lukkes ved slutten av forelderelementet, og en slutt-tagg uten samsvarende åpningstagg beholdes som skrevet.

Eksempler

Lese generert markup

Å formatere med 2 mellomrom viser navigasjonen, listeelementene og hovedinnholdet som et innrykket tre, mens «Priser inkluderer <strong>MVA</strong>.» holder seg på én lesbar linje.

Klargjøre en e-postmal

Minifiser en HTML-e-post med kommentarer slått av for å redusere størrelsen. En <pre>-blokk med en pristabell og den innebygde <style>-taggen beholdes nøyaktig som de var.

Sjekke strukturen

Når en lukkende </div> mangler, viser den formaterte koden de påfølgende elementene rykket inn ett nivå for dypt, noe som gjør det enkelt å se hvor elementet burde ha sluttet.

Ofte stilte spørsmål

Vil formatering endre hvordan siden min ser ut?

I nesten alle tilfeller nei. Mellomromstegn i blokkelementer slås sammen og flyttes til linjeskift, som nettlesere ignorerer. Tekst og innebygde elementer forblir på samme linje, og pre, textarea, script og style blir ikke endret. Sider som er avhengige av CSS white-space: pre på vanlige elementer er unntaket.

Minifiserer den CSS-en og JavaScript-en inne på siden?

Nei. Innholdet i script og style beholdes nøyaktig som det er skrevet, slik at det ikke kan føre til feil. Bruk CSS-formatereren for å minifisere et stilark separat.

Er det trygt å lime inn HTML fra en ukjent kilde?

Ja. Inndataene behandles utelukkende som tekst og settes aldri inn på siden, så skript kjøres ikke, og bilder eller lenker lastes ikke inn.

Validerer det HTML-en min?

Nei. Det er bevisst tolerant og formaterer ødelagt markup i stedet for å avvise det. Feilaktige slutt-tagger beholdes, slik at innrykket hjelper deg med å oppdage dem, men det produseres ingen feilliste.

Personvern

HTML-en din behandles bare i nettleseren din og blir aldri rendret eller lastet opp. Ingenting blir lagret eller inkludert i analyser.