Bidur Sapkota

Markdown is a lightweight markup language that allows you to format text using simple syntax. This guide covers the essential Markdown elements you'll use most frequently.

Table of content

1. Add Headings
2. Text Formatting
3. Lists
4. Links and Images
5. Code
6. Blockquotes
7. Tables
8. Horizontal Lines
9. Line Breaks
10. Escape Character
11. HTML in Markdown
12. Creating Table of Content

---

Add Headings

Use hash symbols (#) to create headers. The number of hashes determines the header level:

Copy
# Header 1 (Largest)

## Header 2

### Header 3

#### Header 4

##### Header 5

###### Header 6 (Smallest)

Output:

Header 1 (Largest)

Header 2

Header 3

Header 4

Header 5

Header 6 (Smallest)

---

---

---

Text Formatting

Bold and Italic

Copy
**Bold text**
_Italic text_
**_Bold and italic_**

Output:

Bold text
Italic text
Bold and italic

---

Strikethrough

Copy
~~Strikethrough text~~

Output:

Strikethrough text

---

---

---

Lists

Unordered Lists

Use dashes (-), asterisks (*)

Copy
- Item 1
- Item 2
  - Nested item
  - Another nested item
- Item 3

* Item 4

Output:

• Item 1
• Item 2
  • Nested item
  • Another nested item
• Item 3

• Item 4

---

Ordered Lists

Use numbers followed by period and space:

Copy
1. First item
2. Second item
   1. Nested numbered item
   2. Another nested item
3. Third item

Output:

1. First item
2. Second item
   1. Nested numbered item
   2. Another nested item
3. Third item

---

---

---

Links and Images

Links

Create links using square brackets for text and parentheses for URL:

Copy
[Link text](https://example.com)
[Link text](https://example.com "Optional title")

<!-- Example -->

[Portfolio Link](https://www.bidursapkota.com.np/)

Output:

Portfolio Link

---

Images

Similar to links but with an exclamation mark at the beginning:

Copy
![Alt text](image-url.jpg)
![Alt text](image-url.jpg "Optional title")

<!-- Example -->

![Profile Picture](/profile.png)

Output:

---

---

---

Code

Inline Code

Use single backticks for inline code

Copy
`inlilne code`

<!-- Example -->

Add internal JavaScript using `<script>` tag

Output:

Add internal JavaScript using <script> tag

---

Code Blocks

Use triple backticks for code blocks:

Copy
```javascript
function add(a, b) {
  return a + b;
}
```

Output:

Copy
function add(a, b) {
  return a + b;
}

---

---

---

Blockquotes

Use the greater than symbol (>) for blockquotes:

Copy
> This is a blockquote.
> It can span multiple lines.
>
> > This is a nested blockquote.

Output:

This is a blockquote. It can span multiple lines.

This is a nested blockquote.

---

---

---

Tables

Create tables using pipes (|) and dashes (-):

Copy
| Header 1 | Header 2 |
| -------- | -------- |
| Cell 1   | Cell 2   |
| Cell 4   | Cell 5   |

Output:

---

---

Table Alignment

Use colons (:) to align columns:

Copy
| Left-aligned |
| :----------- |
| Left         |

Output:

---

Copy
| Center-aligned |
| :------------: |
|     Center     |

Output:

---

Copy
| Right-aligned |
| ------------: |
|         Right |

Output:

---

---

---

Horizontal Lines

Create horizontal lines using three dashes

Copy

---

Output:

---

---

---

---

Line Breaks

• Single line break: End a line with two spaces
• Paragraph break: Leave a blank line between paragraphs
• you can use html <br> tag as well

Copy
paragraph 1
<br>
paragraph 2

paragraph 3
paragraph 4

<!-- without two space in end -->

**Bold text**
_Italic text_

<!-- with two space in end -->

**Bold text**  
_Italic text_

Output:

paragraph 1
paragraph 2

paragraph 3 paragraph 4

Bold text Italic text

Bold text
Italic text

---

---

---

Escape Character

Use backslash (\) to escape special characters:

Copy
\_This will not be italic\_  
\# This will not be a header

Output:

_This will not be italic_
# This will not be a header

---

---

---

HTML in Markdown

You can use HTML tags within Markdown when needed:

Copy
This is <mark>highlighted text</mark>.  
<br> This creates a line break.

Output:

This is highlighted text.

This creates a line break.

---

---

---

Creating Table of Content

• Every heading text is converted to in-page navigation link using following rules

  • all heading text is converted to lowercase letters
  • remove all special characters
  • replace space by hyphen (-)

Copy
## Table of content

1. [HTML, CSS & Js](#html-css--js)

### HTML, CSS & Js

<!-- all letters to lowercase -->
<!-- removed special characters & and , -->
<!-- replaced space by hyphen -->

Output:

Table of content

1. HTML, CSS & Js

HTML, CSS & Js

---

---

---