HTML Type de lien différent Question

Question

Quelle est la différence entre? Je vous remercie.

<img src="images/file.jpg"></img> 

between 

<img src="/images/file.jpg"></img> 

between 

<img src="./images/file.jpg"></img> 

between 

<img src="../images/file.jpg"></img> 

Answer 1

Vous devez en apprendre davantage sur relative and absolute paths.

Voici mes explications pour vos exemples, mais vous devriez vraiment lire le lien afin de comprendre les concepts.

Si l'URL base est "http://example.com/resources/" puis:

<img src="images/file.jpg"></img> 

obtiendrai:

http://example.com/resources/images/file.jpg 

Il ajoute simplement l'URL src à l'URL de base .

---

<img src="/images/file.jpg"></img> 

obtiendrai:

http://example.com/images/file.jpg 

Bacuse l'URL de l'image est ancrée (commence par /), il utilise le domaine et ajoute l'image src au domaine.

---

<img src="./images/file.jpg"></img> 

obtiendrai:

http://example.com/resource/images/file.jpg 

Dans ce cas, il utilise le chemin relatif pour le répertoire courant (.), qui est le répertoire de base (ressources).

---

<img src="../images/file.jpg"></img> 

obtiendrai:

http://example.com/images/file.jpg 

Dans ce cas, il utilise le chemin relatif pour le répertoire parent (..), ce qui en fait monter un répertoire, puis ajoutez le reste de le chemin.

Answer 2

Les premier, troisième et dernier sont relatifs au chemin actuel. Dans le dernier, .. est le dossier parent, ce qui signifie que vous montez essentiellement d'un niveau dans la hiérarchie, et dans le second . est le dossier actuel, ce qui rend l'URI équivalent au premier. Le second est relatif à la racine, puisqu'il commence par /. En savoir plus sur les URI dans le HTML4 spec, ou en général sur Unix-style paths.

Ainsi, si vous êtes à website.com/folder/folder/index.html, les quatre URIs seraient équivalentes à ceci:

website.com/folder/folder/images/file.jpg 
website.com/images/file.jpg 
website.com/folder/folder/images/file.jpg 
website.com/folder/images/file.jpg