Markdown

Markdown beginner guide - List, Links and Images

Learn how to create List, Links and Images using markdown language with an example.

Vasanth Jagadeesan

Vasanth Jagadeesan

— 2 min read
Markdown beginner guide - List, Links and Images

Lists highlights the idea and make the readers understand orderly, when writing, seek a moment to prepare prose into list.

  1. Ordered list
  2. Unordered list

Let's try to create List using HTML and markdown and see how this will save you life.

Using HTML

<ol>
    <li>
        List
        <ol>
            <li>Ordered List</li>
            <li>Unordered List</li>
        </ol>
    </li>
</ol>

Output

  1. List
    1. Ordered List
    2. Unordered List

Now create same list with the markdown syntax.

Ordered List Example
1. Header
2. Emphasis
3. List

Output

  1. Header
  2. Emphasis
  3. List
Sub Ordered List Example
1. List
    1. Ordered List.
    2. Unordered List

Output

  1. List
    • Ordered List.
    • Unordered List

We can create complex list with simply using number in a matter of time with markdown syntax.

Unordered List Example
* Header
* Emphasis
* List

Output

  • Header
  • Emphasis
  • List
Sub Unordered List Example
1. List
    * Ordered List.
    * Unordered List

Output

  1. List
    • Ordered List.
    • Unordered List
  1. Inline style link
  2. Inline style link with title
  3. Reference style link

Inline style link

[Home](https://mobilelabs.in)

Output
Home

Inline style link with title

[Home](https://mobilelabs.in "mobilelabs's Home")

Output
Home with title

Reference style link

[Subscribe](/newsletter/)

Output
Subscribe

Images

  1. Inline style
  2. Reference style

Inline style image

![mobilelab's logo](https://mobilelabs.in/content/images/2020/04/mobilelabs-full.png "mobilelab's logo title")

Output
mobilelab's logo

Inline style image

![mobilelab's favicon](/favicon.png "mobilelab's favicon title")

Output
mobilelab's favicon

Read more