HTML til Pug-konverterer
Konverter HTML-markup til ren Pug (Jade) malsyntaks
HTML-inndata
Pug-utdata
Hva er en HTML til Pug-konverterer?
En HTML til Pug-konverterer omgjor standard HTML-markup til Pug-malsyntaks. Pug erstatter omstendelig HTML med en ren, innrykk-basert syntaks.
For eksempel: <div class="hero"><p>Hei</p></div> blir div.hero
p Hei. Pug brukes ofte med Express.js.
Slik konverterer du HTML til Pug
Folg disse tre trinnene for å transformere HTML til Pug-syntaks.
Lim inn eller last opp HTML
Lim inn HTML-en din i venstre panel, eller klikk pa Last opp.
Se Pug-utdata
Høyre panel viser Pug-malen med .klasse, #id og korrekt innrykk.
Kopier eller last ned
Klikk pa Kopier eller Last ned for å lagre som .pug.
Nar du bruker denne konvertereren
Migrere Express.js-prosjekter
Konverter eksisterende HTML-maler for bruk med Pug som view-motor i Express.
Rydde opp i omstendelig HTML
Pug-syntaksen fjerner alle lukkende tagger og reduserer filen med 30-50%.
Laere Pug-syntaks
Konverter HTML du kjenner og se umiddelbart Pug-ekvivalenten.
Generere prototype-maler
Konverter HTML-utdata fra designverktøy til Pug-maler for Node.js.
Vanlige sporsmal
Hva er Pug-syntaks?
Pug bruker innrykk i stedet for lukkende tagger. Klasser: div.minKlasse. ID-er: div#mittId. Attributter i parenteser: a(href="/").
Haandterer den nestede elementer?
Ja. Konvertereren gaar gjennom DOM og plasserer hvert element pa riktig innrykkniva.
Hvordan behandles attributter?
Alle attributter unntatt klasse og id plasseres i parenteser: input(type="text").
Bevares tekstinnhold?
Ja. Tekstnoder skrives ut som inline-innhold nar det ikke er underordnede elementer.
Lagres HTML-en min?
Nei. Alt skjer i nettleseren din.
Relaterte verktøy
Flere verktøy for å arbeide med HTML: