So sehen Sie eine HTML -Datei im Browser mit Visual Studio -Code an

So sehen Sie eine HTML -Datei im Browser mit Visual Studio -Code an
Nachdem er einen Code im Visual Studio -Code geschrieben hat, sollte er sicher in einem Webbrowser geöffnet werden. Tatsächlich muss beim Erstellen einer Webseite die Ergebnisse oder die Ausgabe des Codes häufig und nach jedem über den Code ausgeführten Vorgang geöffnet und angezeigt werden. Dies geschieht, um sicherzustellen, dass der Code korrekt implementiert wird oder nicht.

In diesem Beitrag werden zwei am häufigsten verwendete Möglichkeiten zum Öffnen eines Visual Studio -Code -HTML -Datei im Webbrowser sein.

Voraussetzung: HTML -Dokument einrichten

Um eine HTML -Datei im Webbrowser anzuzeigen, muss eine HTML -Datei vorhanden sein. Erstellen Sie also zuerst die Datei. Nehmen wir an, es gibt die folgende Datei, die in einem Webbrowser geöffnet werden soll:

Hallo Welt!


Dies ist der Inhalt der Webseite…

-Im obigen Code gibt es ein einfaches

Überschrift und Unterschrift

danach.

Körper
Text-Align: Mitte;

H1
Farbe grün;

Im CSS -Stilelement werden zwei Eigenschaften hinzugefügt (i.e., Text ausrichten und Farbe) in Bezug auf die “Körper" Und "

" Überschrift.

Methode 1: Kopieren und fügen Sie den Dateipfad im Browser ein und fügen Sie sie ein

Eine der Methoden zum Öffnen oder Ansehen der HTML -Datei im Browser ist das Kopieren des Dateipfads und das Einfügen in den Browser. Lassen Sie uns dies ausführlich verstehen.

Klicken Sie mit der rechten Maustaste auf den Namen der Datei und klicken Sie dann auf die “Pfad kopieren" Möglichkeit. Auf diese Weise wird die Datei aus dem Visual Studio -Code kopiert:

Öffnen Sie den Browser und fügen Sie die kopierte URL in den Browser ein:

Dadurch werden die Ergebnisse der Webseite im Browser angezeigt:

Methode 2: Öffnen Sie über den Live -Server

Eine andere Möglichkeit, eine HTML -Datei im Browser anzuzeigen.

TDer Visualstudio -Code “Live -ServerDie Erweiterung wird in dieser Methode verwendet. Installieren Sie also zuerst die Erweiterung, wenn sie noch nicht installiert wurde:

Klicken Sie mit der rechten Maustaste überall in dem Bereich, in dem der Code geschrieben wurde, und wählen Sie dann das ausÖffnen Sie mit Live -Server" Möglichkeit:

Dadurch wird der URL -Link der relevanten Visual Studio -Codedatei automatisch geladen und die Ergebnisse im Browser angezeigt:

Dies waren die beiden häufigsten Methoden, um eine HTML -Datei im Browser anzuzeigen.

Abschluss

Eine HTML -Datei im Visual Studio -Code kann im Browser auf verschiedene Weise angezeigt werden. Eine der Möglichkeiten besteht darin, den Dateipfad aus Visual Studio Code zu kopieren und ihn dann in den Webbrowser einzufügen. Eine andere Möglichkeit ist die Verwendung der Visual Studio Live Server -Erweiterung, um die Datei -URL im Webbrowser zu laden. Dieser Artikel erläuterte beide Methoden im Detail.