Using Images in Markdown

Markdown Image Syntax

The syntax for adding images in Markdown is as follows:

![alt text](image URL)
![alt text](image URL "Optional Title")
  • Begin with an exclamation mark !
  • Followed by square brackets with the image's alt text
  • Followed by normal parentheses with the image URL, and optionally, a 'title' attribute enclosed in quotes

Example usage:

![Webcode101 Logo](https://www.webcode101.com/Template/RanEn/skin/images/logo_default.png)

![Webcode101 Logo](https://www.webcode101.com/Template/RanEn/skin/images/logo_default.png "Webcode101")

The display results are as follows:

Using Images in Markdown0

You can also use variables for image URLs like you would for links:


This link uses 1 as the URL variable [webcode101][1].
Then assign the URL at the end of the document:

[1]: https://www.webcode101.com/Template/RanEn/skin/images/logo_default.png

The display result is as follows:

Using Images in Markdown0

 

Markdown does not currently support setting image height and width. If needed, you can use the standard <img> tag:

<img src="https://www.webcode101.com/Template/RanEn/skin/images/logo_default.png" width="50%">

The display result is as follows: