Ajouter des images dans Markdown et modifier la taille de l'image

«Markdown» est l'un des langues de balisage qui fournit différentes installations pour ajouter du texte, des titres, des paragraphes, des listes et des liens et nous pouvons également appliquer le formatage à ces éléments dans Markdown. Nous pouvons également insérer des images dans Markdown, puis modifier la taille des images que nous avons ajoutées dans Markdown. Pour modifier ou modifier la taille de l'image dans Markdown, nous devons utiliser la balise. Nous vous montrerons, dans ce guide, comment ajouter des images dans Markdown ainsi que comment modifier la taille de l'image dans Markdown.

Pour ajouter des images dans Markdown:

La syntaxe est donnée ci-dessous.

![Texte alt] (Chemin du nom de l'image / de l'image avec l'extension "Texte qui montre quand MouseOver")

Pour modifier la taille de l'image dans Markdown:

Pour modifier la taille de l'image dans Markdown, nous utilisons la balise «» du HTML. Seule cette balise aide à modifier la taille de l'image dans Markdown et la syntaxe de cette balise «» est donnée ci-dessous.

Nous pouvons modifier la taille de l'image en définissant les valeurs de largeur et de hauteur en nombres ainsi que dans les pourcentages. Nous pouvons également utiliser l'attribut de style dans cette balise «» pour modifier la taille de l'image dans Markdown.

Exemple # 01:

Nous utilisons le code Visual Studio pour effectuer les codes Markdown. Pour les codes Markdown, nous devons ouvrir à la fois l'éditeur de texte ainsi que la fenêtre d'aperçu. Dans l'éditeur de texte, nous devons ajouter l'entrée et la sortie est obtenue dans la fenêtre d'aperçu. Dans l'éditeur de texte, nous ajoutons d'abord l'image dans Markdown en plaçant le «!"Symbole puis ajouter des crochets dans lesquels nous ajoutons" Texte alt ". Maintenant, nous ajoutons le chemin de l'image.

Nous entrons le nom de l'image avec son extension car le code et l'image sont enregistrés dans le même répertoire. Donc, nous ajoutons juste le nom ici qui est «Cloud.png ”. Ensuite, nous ajoutons le texte qui est «Image de cloud» et c'est le texte qui ne montre que lorsque la souris. Maintenant, l'image est ajoutée et nous pouvons également voir cette image dans la fenêtre d'aperçu.

L'image cloud est affichée ci-dessous car nous avons ajouté cette image dans le code de démarque qui s'affiche ci-dessus.

Exemple # 02:

Maintenant, nous modifions la taille de cette image en utilisant la balise «». Tout d'abord, nous entrons le «Src» dans lequel le nom ou le chemin de l'image est ajouté. Après cela, nous placons «Alt» et ajustons «l'image cloud». Nous avons ajusté la «largeur» de l'image à «230». La «hauteur» est ajustée à «300». Nous ajoutons également le «titre» de cette balise «» et la valeur de ce «titre» est le «titre cloud». Maintenant, la taille de l'image est modifiée. Vous pouvez voir la taille modifiée de l'image dans la fenêtre d'aperçu.

La taille de l'image dans ce résultat est modifiée et la «largeur» de l'image est «230» et la «hauteur» est «300». En effet.

Exemple # 03:

Nous pouvons également modifier l'image «largeur» et «hauteur» en mettant leurs valeurs en pourcentages. Après avoir ajouté le nom ou le chemin de l'image et ajusté le «Alt» à «l'image du nuage», nous avons défini la «largeur» et la «hauteur» de l'image à «50%». Ensuite, ajoutez le «titre» et fermez cette balise.

Voici l'image dont la taille est modifiée en utilisant la balise «». La hauteur de l'image, ainsi que la largeur, sont «50%».

Exemple # 04:

Maintenant, nous utilisons l'attribut «style» dans cette balise «» pour modifier la taille de l'image dans Markdown. Nous devons ajouter le nom de l'image puis l'attribut «alt». Après cela, nous avons mis l'attribut «style» et ajouté «largeur et hauteur» comme valeurs. La «largeur» que nous définissons est en pixels qui est «500px» et la «hauteur» est «400px». Maintenant, la taille de l'image s'ajustera en conséquence.

La taille de l'image dans ce résultat a été mise à jour; Sa «largeur» est maintenant «500px» et sa «hauteur» est «400px». Ceci est visible à la suite du code Markdown qui est donné ci-dessus où nous avons ajusté la largeur et la hauteur de l'attribut de style.

Exemple # 05:

Nous ajoutons une autre image. Mais dans ce code Markdown, nous ne modifions pas la taille de l'image. La taille de l'image n'est modifiée que lorsque nous avons utilisé la balise «». Nous avons mis le «!"Puis ajoutez le texte à l'intérieur des crochets qui est" Image du soleil ". Après avoir fermé les crochets, nous plaçons les parenthèses dans lesquelles nous avons inséré le nom de l'image «New_sun.png ”puis ajouter le texte qui s'affiche sur MouseOver. La taille d'origine de l'image se présentera dans le résultat.

L'image du soleil est montrée car nous avons ajouté cette image dans le code de marque. De plus, la taille d'origine de l'image est visible car nous ne pouvons pas ajuster la taille de l'image sans utiliser la balise «».

Exemple # 06:

En utilisant la balise «», nous modifions maintenant la taille de cette image. Tout d'abord, nous ajoutons le nom ou le chemin de l'image dont nous voulons modifier la taille au champ «SRC». La «largeur» et la «hauteur» de l'image ont toutes deux été changées en «300». La taille de l'image a maintenant changé. La fenêtre d'aperçu montre la nouvelle taille de l'image.

La largeur et la hauteur de l'image ont été à la fois modifiées à «300».

Exemple # 07:

En définissant les valeurs de «largeur» et de «hauteur» de l'image en pourcentages, nous pouvons facilement modifier ces dimensions. Nous avons tous deux ajusté la «largeur» et la «hauteur» de l'image à «40%», puis fermé cette balise.

Voici l'image avec 40% de hauteur et également 40% dans sa largeur. Nous avons ajouté cette largeur et cette hauteur à l'intérieur de la balise «» après avoir ajouté le nom de l'image.

Exemple # 08:

Maintenant, nous utilisons l'attribut «style» dans la balise «» pour modifier la taille de l'image dans Markdown. Nous avons ajouté «largeur et hauteur» comme valeurs à l'attribut «style» après avoir ajouté le nom de l'image et l'attribut «Alt». La «largeur» que nous spécifions est «450px», tandis que la «hauteur» est également ajustée à «450px."La taille de l'image changera désormais de manière appropriée en fonction de ces nouvelles valeurs de largeur et de hauteur.

Maintenant, le résultat de ce code est également affiché dans la fenêtre d'aperçu qui s'affiche ci-dessous. La largeur et la hauteur de cette image sont maintenant «450px» dans ce résultat ci-dessous.

Conclusion:

Nous avons exploré le concept d'ajout d'images en détail dans ce guide et nous avons également exploré comment modifier la taille de l'image dans Markdown également. Nous avons ajouté les images dans Markdown et modifié leur taille à l'aide de la balise «» et avons montré comment faire tout cela dans Markdown. Nous avons changé la taille de l'image en mettant les valeurs de largeur et de hauteur en nombre ainsi que dans les pourcentages. Nous avons également utilisé l'attribut de style dans la balise «» pour mettre à jour ou modifier la taille de l'image dans Markdown.