web-dev-qa-db-fra.com

HTML: l'image ne s'affiche pas?

Je suis un peu novice en HTML. J'essaie d'afficher une image sur mon site Web, mais pour une raison quelconque, elle affiche uniquement une zone bleue avec un point d'interrogation. J'ai regardé partout sur Internet, mais aucune des solutions ne semblait fonctionner pour moi. J'ai essayé:

<img src="iwojimaflag.jpg"/>

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

<img src="Applications/MAMP/htdocs/Symfony/src/Acme/WebBundle/Resources/public/images/iwojimaflag.jpg"/>
htmlimageweb
3
Gretta

Juste pour développer la réponse de niko :

Vous pouvez référencer n'importe quelle image via son URL. Peu importe où il se trouve, tant que c'est accessible, vous pouvez l'utiliser comme src. Exemple:

Position relative :

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

L'image est recherchée par rapport à l'emplacement du document . Si votre document est à http://example.com/site/document.html, votre dossier images doit se trouver dans le même répertoire que votre fichier document.html.

Emplacement absolu :

<img src="/site/images/image.png">
<img src="http://example.com/site/images/image.png">

ou

<img src="http://another-example.com/images/image.png">

Dans ce cas, votre image sera recherchée à la racine du site du document , donc, si votre document.html est à http://example.com/site/document.html, la racine sera à http://example.com/ (ou son répertoire respectif sur le système de fichiers du serveur, généralement www/). Les deux premiers exemples sont les mêmes, car les deux pointent vers le même hôte. Considérez le premier / comme un alias de la racine de votre serveur. Dans le second cas, l'image est située dans un autre hôte. Vous devez donc spécifier l'URL complète de l'image.

Concernant /, . et ..:

Le symbole / renvoie toujours la racine d'un système de fichiers ou d'un site.

Le point unique ./ pointe vers le même répertoire que celui où vous vous trouvez.

Et le double point ../ désignera le répertoire supérieur, ou celui qui contient le répertoire de travail réel.

Ainsi, vous pouvez créer des itinéraires relatifs en les utilisant.

Exemples donnés avec l'itinéraire http://example.com/dir/one/two/three/ et votre document appelant se trouvant à l'intérieur de three/:

"./pictures/image.png"

ou juste

"pictures/image.png"

Je vais essayer de trouver un répertoire nommé pictures dans http://example.com/dir/one/two/three/.

"../pictures/image.png"

Je vais essayer de trouver un répertoire nommé pictures dans http://example.com/dir/one/two/.

"/pictures/image.png"

Je vais essayer de trouver un répertoire nommé pictures directement à / ou example.com (qui sont identiques), au même niveau que directory.

4
arielnmz

Permet de rechercher des moyens de référencer l'image.

Sauvegarder un répertoire

../

Dossier dans un répertoire:

 foldername/

Fichier dans un répertoire

 imagename.jpg

Maintenant, combinons-les avec les adresses que vous avez spécifiées.

 /Resources/views/Default/index.html
 /Resources/public/images/iwojimaflag.jpg

Le premier répertoire commun référencé à partir du fichier html est trois arrière:

 ../../../

Il est dans deux dossiers dans ce qui suit:

 ../../../public/images/

Et vous avez atteint l'image:

 ../../../public/images/iwojimaflag.jpg

Remarque: Ceci suppose que vous accédez à une page sur domain.com/Resources/views/Default/index.html, comme vous l'avez spécifié dans votre commentaire.

3
user3728283

Si vous mettez <img src="iwojimaflag.jpg"/> dans le code html, placez iwojimaflag.jpg et le fichier html dans le même dossier.

Si vous mettez <img src="images/iwojimaflag.jpg"/>, vous devez alors créer un dossier "images" et y placer une image.

0
Arshid KV

img {
  width: 200px;
}
<img src="https://image.ibb.co/gmmneK/children_593313_340.jpg"/>

<img src="https://image.ibb.co/e0RLzK/entrepreneur_1340649_340.jpg"/>

<img src="https://image.ibb.co/cks4Rz/typing_849806_340.jpg"/>

s'il vous plaît voir le code ci-dessus.

0
Arshiya Khanam