it-swarm.com.de

HTML - Bilder des Stammordners aus Unterordner auswählen

lassen Sie uns folgendes sagen: DIR - Struktur meiner Website DIR STRUCTURE

Jetzt in index.html kann ich einfach Bilder wie referenzieren 

<img src="./images/logo.png">

aber was ist, wenn ich auf dasselbe Bild von sub.html verweisen möchte, was dassrc

57
Moon
<img src="../images/logo.png">
          __ ______ ________
          |    |       |
          |    |       |___ 3. Get the file named "logo.png"
          |    |
          |    |___ 2. Go inside "images/" subdirectory
          | 
          | 
          |____ 1. Go one level up
78
aularon

../images/logo.png wird Sie um einen Ordner zurückschieben.

../../images/logo.png verschiebt Sie um zwei Ordner.

/images/logo.png bringt Sie zurück in den Stammordner, egal wo Sie sich gerade befinden.

86
Moses

Die relative Referenz wäre

<img src="../images/logo.png">

Wenn Sie den Speicherort relativ zum Stamm des Servers kennen, ist dies möglicherweise der einfachste Ansatz für eine App mit einer komplexen verschachtelten Verzeichnishierarchie. In allen Ordnern ist dies derselbe.

Wenn sich beispielsweise Ihre in Ihrer Frage dargestellte Verzeichnisstruktur relativ zum Stamm des Servers befindet, verwenden index.html und sub_folder/sub.html beide:

<img src="/images/logo.png">

Befindet sich der images-Ordner stattdessen im Stammverzeichnis einer Anwendung wie foo unter dem Server-Root (z. B. http://www.example.com/foo), verwenden index.html (http://www.example.com/foo/index.html) z. B. und sub_folder/sub.html (http://www.example.com/foo/sub_folder/sub.html) beide:

<img src="/foo/images/logo.png">
9
Bert F

Ihre index.html kann nur src="images/logo.png" und von sub.html aus src="../images/logo.png"

3
Robusto

../ bringt Sie einen Ordner in den Verzeichnisbaum. Wählen Sie dann den entsprechenden Ordner und dessen Inhalt aus.

../images/logo.png
0
Bopsi

wenn Sie Ihre Dateien auf den Server hochladen, sollten Sie darauf achten, dass einige Bilder Ihrer Bilder nicht auf der Webseite angezeigt werden. Ein abgestürztes Symbol bedeutet, dass der Dateipfad nicht ordnungsgemäß angeordnet oder codiert ist, wenn Sie über die folgende Dateistruktur verfügen, die der Code enthalten soll so sein Dateistruktur: -> web (Hauptordner) -> Bilder (Unterordner) -> logo.png (Bild im Unterordner) Der Code für den oben genannten Code folgt diesem Standard 

 <img src="../images/logo.jpg" alt="image1" width="50px" height="50px">

wenn Sie Ihre Dateien auf den Webserver hochgeladen haben, indem Sie die Dateistruktur .__ vernachlässigen, ohne den Ordner web zu erstellen. Wenn Sie die Dateien direkt hochladen, werden Ihre Bilder beschädigt. Sie können keine Bilder sehen. Ändern Sie dann den Code wie folgt

 <img src="images/logo.jpg" alt="image1" width="50px" height="50px">

danke-> vamshi krishnan 

0
vamsikrish

wenn Sie Ihre Dateien auf den Server hochladen, sollten Sie darauf achten, dass einige Bilder Ihrer Bilder nicht auf der Webseite angezeigt werden. Ein abgestürztes Symbol bedeutet, dass der Dateipfad nicht ordnungsgemäß angeordnet oder codiert ist, wenn Sie über die folgende Dateistruktur verfügen, die der Code enthalten soll So wie diese Dateistruktur aussehen: -> Web (Hauptordner) -> Bilder (Unterordner) -> logo.png (Bild im Unterordner) Der Code für den obigen Code folgt diesem Standard

<img src="../images/logo.jpg" alt="image1" width="50px" height="50px">

wenn Sie Ihre Dateien auf den Webserver hochgeladen haben, indem Sie die Dateistruktur vernachlässigen, ohne den Ordner web zu erstellen. Wenn Sie die Dateien direkt hochladen, werden Ihre Bilder beschädigt. Sie können keine Bilder sehen. Ändern Sie dann den Code wie folgt

<img src="images/logo.jpg" alt="image1" width="50px" height="50px">

danke-> vamshi krishnan