DEV Community

Dev
Dev

Posted on • Updated on

Basics of Markdown

In this blog, we will learn Markdown.

**Markdown is a lightweight markup language used for creating simple formatted text. This language can be used to give basic but effective design for websites, description of repositories in platforms like GitHub, Bitbucket etc and also write blogs on some platforms like dev.to

So now let's explore Markdown!

Basic Syntax

Headings

Use hashes ' # ' to define Headings.

H1

H2

H3

H4

H5

No. of hashes define the heading sizes in Markdown. A single hash (#) means H1 and five hashes means H5.

Bold, Italics and Strikethrough

Enclose text between ' ** ' or ' __ ' for making text Bold
Enclose text between ' * ' or ' _ ' for making text Italics.
Enclose text between ' ~~ ' for Strikethrough.

Blockquotes

Put ' > ' before your text to display it as a Blockquote.

Lists

  • Use numbers followed by a dot (ex: 1.) to make an ordered list. Putting the wrong number values doesn't hamper the correctiveness of the list.
  • Use dash (-), asterisk (*) or plus (+) symbol to make unordered list.
  • Use indentation with the list symbols to create sub-items in the list.

Code Blocks

Enclose the code between pairs of 3 continuous back quotes (`) to make it a code block. This takes the indentations into account as it creates a 'pre' tag around the code. Also put the code around braces '{}' to give it a look of a code block. To mention the code language, we can also mention it after the first 3 continuous back quotes. For example:

  '''
     {
        This is a code statement.
     }
  '''

Alternatively we can also enclose the code inside the braces '{}' only to form a code block put this method does not keep indentation into account, thus is not recommended.

Images

Images can be embeded using the following syntax.

  ![Alt Text](Image URL "Title Text")

Jim Carrey Typing Gif

Links and Emails

Links and Emails can be embeded using the following syntax.

Links:
[Display Text](Link URL "Title Text")

Emails:
1. Put email address inside <>
2. [Display Text](mailto:email_address "Title Text")

This is my GitHub Profile.
You can contact me at devmittal0407@gmail.com

Extended Syntax

Extended Syntax is the set of advance concepts of Markdown library.
NOTE: Currently dev.to doesn't support Extended syntax so you may not be able to get the correct output, but feel free to try this on other platforms that supports extended syntax like GitHub etc.

Tables

We can create table under Extended Syntax using the following:

| Left | Centre | Right |
|:-----|:------:|------:|
|1     |2       |3      |

Output

Left Centre Right
1 2 3

Colons(:) are used to define the alignment of the next cell. On the above output, headings denote which alignment the colons will apply.

Task Lists

Task lists are checkbox based lists.

[ ] Unchecked Item
[x] Checked Item

That's an end to this guide of Markdown. Have fun exploring more.

Top comments (0)