Analyse des Unterschieds zwischen relativem und absolutem HTML-Pfad
|
Gerade HTML-Anfänger stehen häufig vor dem Problem, eine Datei richtig zu referenzieren. Wie verweisen Sie beispielsweise in einer HTML-Seite als Hyperlink auf eine andere HTML-Seite? So fügen Sie ein Bild in eine Webseite ein Wenn Sie beim Verweisen auf eine Datei (z. B. beim Hinzufügen eines Hyperlinks oder Einfügen eines Bildes usw.) den falschen Dateipfad verwenden, wird der Verweis ungültig (die verknüpfte Datei kann nicht durchsucht werden oder das eingefügte Bild kann nicht angezeigt werden usw.). Um diese Fehler zu vermeiden und Dateien richtig zu referenzieren, müssen wir uns mit HTML-Pfaden vertraut machen. Es gibt zwei Möglichkeiten, Pfade in HTML zu schreiben: relative Pfade und absolute Pfade. Relativer HTML-Pfad Dateiverweise im selben Verzeichnis. Wenn sich die Quelldatei und die referenzierte Datei im selben Verzeichnis befinden, schreiben Sie einfach den referenzierten Dateinamen. Wir erstellen jetzt eine Quelldatei info.html und referenzieren die Datei index.html als Hyperlink in info.html. Angenommen, der Pfad zu info.html lautet: c:\Inetpub\wwwroot\sites\blabla\info.html Angenommen, der Pfad zu index.html lautet: c:\Inetpub\wwwroot\sites\blabla\index.html Der Code zum Hinzufügen eines Hyperlinks zu index.html in info.html sollte wie folgt geschrieben werden: <a href = "index.html">index.html</a> So geben Sie das übergeordnete Verzeichnis an ../ stellt das übergeordnete Verzeichnis der Quelldatei dar, ../../ stellt das übergeordnete Verzeichnis der Quelldatei dar und so weiter. Angenommen, der Pfad zu info.html lautet: c:\Inetpub\wwwroot\sites\blabla\info.html Angenommen, der Pfad zu index.html lautet: c:\Inetpub\wwwroot\sites\index.html Der Code zum Hinzufügen eines Hyperlinks zu index.html in info.html sollte wie folgt geschrieben werden: <a href = "../index.html">index.html</a> Angenommen, der Pfad zu info.html lautet: c:\Inetpub\wwwroot\sites\blabla\info.html Angenommen, der Pfad von index.html lautet: c:\Inetpub\wwwroot\index.html Der Code zum Hinzufügen eines Hyperlinks zu index.html in info.html sollte wie folgt geschrieben werden: <a href = "../../index.html">index.html</a> Angenommen, der Pfad zu info.html lautet: c:\Inetpub\wwwroot\sites\blabla\info.html Angenommen, der Pfad zu index.html lautet: c:\Inetpub\wwwroot\sites\wowstory\index.html Der Code zum Hinzufügen eines Hyperlinks zu index.html in info.html sollte wie folgt geschrieben werden: <a href = "../wowstory/index.html">index.html</a> Wie gibt man an, dass ein Unterverzeichnis auf eine Datei in einem Unterverzeichnis verweist? Schreiben Sie einfach den Pfad der Unterverzeichnisdatei. Angenommen, der Pfad zu info.html lautet: c:\Inetpub\wwwroot\sites\blabla\info.html Angenommen, der Pfad zu index.html lautet: c:\Inetpub\wwwroot\sites\blabla\html\index.html Der Code zum Hinzufügen eines Hyperlinks zu index.html in info.html sollte wie folgt geschrieben werden: <a href = "html/index.html">index.html</a> Angenommen, der Pfad zu info.html lautet: c:\Inetpub\wwwroot\sites\blabla\info.html Angenommen, der Pfad zu index.html lautet: c:\Inetpub\wwwroot\sites\blabla\html\tutorials\index.html Der Code zum Hinzufügen eines Hyperlinks zu index.html in info.html sollte wie folgt geschrieben werden: <a href = "html/tutorials/index.html">index.html</a> Absoluter HTML-Pfad Der absolute HTML-Pfad bezieht sich auf den vollständigen Pfad der Datei mit dem Domänennamen. Angenommen, Sie registrieren den Domänennamen www.jb51.net und beantragen einen virtuellen Host. Ihr virtueller Host-Anbieter stellt Ihnen ein Verzeichnis wie www zur Verfügung. Dieses www ist das Stammverzeichnis Ihrer Website. Angenommen, Sie legen eine Datei index.html im WWW-Stammverzeichnis ab. Der absolute Pfad dieser Datei lautet: https://www.jb51.net/index.html. Angenommen, Sie haben im Stammverzeichnis www ein Verzeichnis mit dem Namen html_tutorials erstellt und dann eine Datei index.html in das Verzeichnis eingefügt. Der absolute Pfad dieser Datei lautet https://www.jb51.net/html_tutorials/index.html. |
<<: Implementierungsbeispiel für ein JS-natives zweispaltiges Shuttle-Auswahlfeld
>>: Vier Möglichkeiten, CSS und HTML zu kombinieren
Artikel empfehlen
Der einfachste Weg zum Debuggen gespeicherter Prozeduren in MySQL
Ein Kollege hat mir einmal gesagt, ich solle eine...
Erstellen einer verteilten Selenium-Umgebung basierend auf Docker
1. Laden Sie das Bild herunter Docker-Pull Seleni...
Ausführliches Tutorial zur Konfiguration der kostenlosen Installationsversion von MySQL 8.0.23
Der erste Schritt besteht darin, die kostenlose I...
Einführung in die Verwendung von CSS3-Filterattributen
1. Einleitung Beim Schreiben von Animationseffekt...
MySQL erhält das aktuelle Datum und die aktuelle Uhrzeit Funktionsbeispiel detaillierte Erläuterung
Holen Sie sich das aktuelle Datum + die aktuelle ...
MySQL-Installation mehrerer Instanzen - Boot- und Autostart-Dienstkonfigurationsprozess
1. Mehrere MySQL-Instanzen MySQL Multi-Instance b...
Detaillierte Erläuterung der grundlegenden Verwendung der CentOS7-Firewall unter Linux
1. Grundlegende Verwendung von Firewalld Start-up...
Konfigurieren Sie eine Selenium-Umgebung basierend auf Linux und implementieren Sie den Betrieb
1. Selenium unter Linux verwenden 1. Installieren...
Verständnis und Anwendung des Destrukturierungsoperators von JavaScript ES6
Inhaltsverzeichnis Vorwort Die Rolle von Dekonstr...
Natives JS zur Implementierung des Flugzeug-Kriegsspiels
In diesem Artikelbeispiel wird der spezifische JS...
Ein tiefer Einblick in JavaScript-Promises
Inhaltsverzeichnis 1. Was ist Promise? 2. Warum g...
Zwei Möglichkeiten zum korrekten Bereinigen von MySQL-Binlog-Protokollen
mysql bereinigt Binlog-Protokolle korrekt Vorwort...
Detailliertes Tutorial zur Verwendung von Docker zum Erstellen einer Laravel-Entwicklungsumgebung in der Win10-Home-Version
Betriebssystem: Win10 Home Edition Installieren S...
Design Association: Warum haben Sie am falschen Ort gesucht?
Ich bin vor ein paar Tagen mit dem Bus zur Arbeit...
11 Möglichkeiten, Duplikate aus JS-Arrays zu entfernen
Bei der tatsächlichen Arbeit oder bei Interviews ...