La possibilité d'intégrer des images dans un message pour apparaître lorsque les utilisateurs voient quelque chose rend HTML utile pour la communication par e-mail. Étant donné que tout est autonome, vous n'avez besoin d'un serveur Web nulle part pour héberger l'image. Les utilisateurs peuvent intégrer n'importe quel type d'image dans un document HTML, que ce soit sous la forme de .PNG, JPEG et autres.

Ce blog expliquera:

• Méthode 1: Comment intégrer un «.Png ”Image en html avec balise?
• Méthode 2: Comment intégrer un «.PNG ”Image en HTML avec les propriétés CSS?

Commençons par intégrer un .Image PNG dans une page HTML!

Méthode 1: Comment intégrer un «.Png ”Image en html avec balise?

Pour intégrer un .Image PNG dans une page HTML, utilisez le «" étiqueter. Ensuite, insérez le «SRC«Attribut et ajoutez le«.PNG”Image comme le«SRC" valeur. Pour des implications pratiques, suivez les étapes indiquées ci-dessous.

Étape 1: insérer

Initialement, utilisez le HTML "

”Tag pour ajouter une rubrique dans le document HTML.

Étape 2: Concevoir un conteneur div

Ensuite, concevez un conteneur div en ajoutant le «"Element et insérer un cours de classe ou d'identification en fonction de votre choix. Ensuite, définissez la valeur de cette propriété pour une utilisation ultérieure.

Étape 3: Ajouter ".image png ”

Maintenant, utilisez un "”TAG pour ajouter tout type de fichier multimédia à la page HTML. Pour ce faire, le «SRC"L'attribut a été ajouté à l'intérieur du""Tag, et a ajouté une image PNG comme"SRC" valeur. De plus, vous pouvez appliquer le style en utilisant la ligne «style”Attribut et définition des propriétés CSS que vous souhaitez appliquer:

Encombrer .Image PNG

On peut observer que l'image spécifiée a été intégrée avec succès:

Méthode 2: Comment intégrer un «.PNG ”Image en HTML avec les propriétés CSS?

Pour intégrer un ".PNG”Image dans une page HTML utilisant les propriétés CSS, le«image de fond»La propriété peut être utilisée. Pour des implications pratiques, essayez les instructions déclarées.

Étape 1: Ajouter un en-tête

Dans HTML, ajoutez une rubrique à l'aide de l'étiquette de cap de "

" pour "

" étiqueter.

Étape 2: Créez un conteneur «div»

Ensuite, utilisez le "”Tag pour créer un conteneur div dans un document HTML:

Encombrer .Image PNG

Sortir

Étape 3: Ajouter ".image png ”

Accédez au conteneur Div en utilisant le sélecteur d'attribut avec une valeur d'attribut particulière comme «.div-iMg»:

.div-iMg
Hauteur: 50% PX;
Largeur: 50% PX;
taille arrière: contenir;
Image d'arrière-plan: URL (/ Spring-Flowers.png)

Après cela, appliquez ces propriétés CSS:

• "Hauteur et largeur»Les propriétés sont utilisées pour régler la taille de l'élément indiqué
• "taille de l'arrière-plan»Spécifie la taille de l'image d'arrière-plan. À cette fin, la valeur de cette propriété est définie comme «contenir".
• "image de fond"Insère une image en utilisant le"URL ()" fonction.

Sortir

Il s'agit d'incorporer un «.PNG”Image dans une page HTML.

Conclusion

Pour intégrer un ".PNG”Image dans une page HTML, le«”La balise est utilisée. Ensuite, ajoutez le "SRC«Attribuez et insérez le«.PNG"Image comme la valeur de"SRC". Vous pouvez également utiliser le «image de fond«Propriété CSS pour ajouter un«.PNG”Image sur une page HTML. Ce tutoriel a tout démontré sur l'intégration .Image PNG dans une page HTML.