Hvordan vise HTML-kilden i Google Chrome

Enten du er en webdesigner som feilsøker nettstedets kildekode eller bare er nysgjerrig på hvordan nettstedets kode ser ut, kan du se HTML-kilden rett i Google Chrome. Det er to måter å vise HTML-kilden på: Vis kilde og inspiser ved hjelp av utviklerverktøy.

Vis kilde ved hjelp av Vis sidekilde

Start Chrome og hopp til nettsiden du vil vise HTML-kildekoden. Høyreklikk siden og klikk på "Vis sidekilde", eller trykk Ctrl + U for å se sidens kilde i en ny fane.

En ny fane åpnes sammen med all HTML for websiden, fullstendig utvidet og uformatert.

Hvis du leter etter et bestemt element eller del i HTML-kilden, er det kjedelig og tungvint å bruke Vis kilde, spesielt hvis siden bruker mye JavaScript og CSS.

Inspiser kilde ved hjelp av utviklerverktøy

Denne metoden bruker Developer Tools-ruten i Chrome og er en mye renere tilnærming for å se kildekoden. HTML er lettere å lese her takket være den ekstra formateringen og muligheten til å skjule elementer du ikke er interessert i å se.

Åpne Chrome og gå til siden du vil inspisere; trykk deretter Ctrl + Shift + i. En forankret rute åpnes ved siden av nettsiden du ser på.

Klikk på den lille grå pilen ved siden av et element for å utvide den ytterligere.

Hvis du ikke ønsker å se hele sidekoden som standard, men i stedet inspisere et bestemt element i HTML-en, høyreklikker du det området på siden og klikker deretter på "Inspiser."

Når ruten åpnes denne gangen, går den direkte til den delen av koden som inneholder elementet du klikket på.

Hvis du vil endre dock-posisjonen, kan du flytte den til bunnen, til venstre, til høyre eller til og med fjerne den i et eget vindu. Klikk på menyikonet (tre prikker), og velg deretter enten løsne i et eget vindu, koble til henholdsvis, koble til bunnen eller koble til høyre.

Det er alt det er med det. Når du er ferdig med å se på koden, lukker du fanen Vis kilde eller klikker på 'X' i ruten for utviklerverktøy for å gå tilbake til websiden din.