Latest web development tutorials

l'image HTML

Exemples

Norwegian Mountain Trip

Pulpit rock

Essayez »

Exemples

exemples en ligne

Insérer une image
Cet exemple montre comment afficher des images dans une page Web.

Insérer des photos de différents endroits
Cet exemple montre comment les différentes images du dossier ou de serveur pour afficher les pages Web.

(Vous pouvez trouver plus d'exemples au bas de cette page.)


l'image HTML - la balise image (<img>) et un attribut source (Src)

En HTML, les images sont définies par la balise <img>.

Balise <img> est vide, ce qui signifie qu'il contient des attributs, et non balise de fermeture.

Pour afficher l'image sur la page, vous devez utiliser l'attribut source (src). src fait référence à la "source". Valeur de l'attribut source est l'URL de l'image.

l'image syntaxe personnalisée est:

<img src="url" alt="some_text">

URL fait référence à l'emplacement de stockage des images. Si l'image est nommé "boat.gif" situé www.w3school.com.cn le répertoire images, l'URL est http://www.w3school.com.cn/images/boat.gif.

Le navigateur affiche l'image dans le document où l'étiquette d'image apparaît. Si vous mettez une balise d'image entre deux paragraphes, le navigateur affichera d'abord le premier paragraphe, puis afficher l'image affichée dernière deuxième alinéa.


images HTML - Alt Attribute

attribut alt est utilisé comme une autre définition d'une chaîne d'images de texte préparé.

Remplacer les propriétés du texte sont des valeurs définies par l'utilisateur.

<img src="boat.gif" alt="Big Boat">

Lorsqu'un navigateur ne peut pas charger les images, remplacer les attributs de texte disent les lecteurs, ils perdent l'information. Dans ce cas, le navigateur affiche le texte alternatif au lieu d'images. L'image sur la page sont combinés avec la propriété text de substitution est une bonne habitude, ce qui contribue à une meilleure information d'affichage, et pour ceux qui utilisent simplement le navigateur de texte est très utile.


HTML Images - Réglez la hauteur et la largeur d'image

hauteur (hauteur) et la largeur (largeur) Propriété de réglage de la largeur et la hauteur de l'image.

La valeur d'attribut par défaut en pixels:

<img src="pulpit.jpg" alt="Pulpit rock" width="304" height="228">

Astuce: Une bonne image de la hauteur spécifiée et la largeur de l'habitude. Il conservera la taille spécifiée si la hauteur de l'image est spécifiée largeur, chargement de la page. Si vous ne spécifiez pas la taille de l'image, il est possible lorsque la page se charge mineraient la disposition générale des pages HTML.


Les précautions de base - conseils utiles:

Remarque: Si un fichier HTML contient des images dix, puis pour afficher cette page correctement, vous devez charger 11 fichiers.image de charge prend du temps, donc notre conseil est: l'image de la prudence.

Remarque: Lorsque la page est chargée, de prêter attention à insérer chemin d'image de page, si la position de l'image ne peut pas être réglée correctement, le navigateur ne peut pas charger l'image, la balise d'image affiche une image brisée.


Exemples

D'autres exemples

Arrangement photos
Cet exemple illustre comment agencer les images dans le texte.

Floating Images
Cet exemple montre comment rendre l'image float au paragraphe gauche ou à droite.

Réglage de lien d'image
Cet exemple montre comment utiliser l'image comme un lien.

Création d' une carte d'image
Cet exemple montre comment créer des cartes d'image avec des zones cliquables. Chacune de ces régions est un lien hypertexte.


HTML balise d'image

标签 描述
<img> 定义图像
<map> 定义图像地图
<area> 定义图像地图中的可点击区域