Getting Started With Markdown [Beginner’s Guide]

Getting Started With Markdown [Beginner’s Guide]

·

2 min read

Markdown has gained popularity because it's easy to use and it's widely accepted across platforms.

You can use markdown to write content that can be conveyed in plain text. A good example would be a blog post.

What is Markdown?

Markdown is a simple lightweight markup language that is widely used as a formatting language on the web. Few points that make markdown a wonderful option are:

  • Simple text format hence, easy to learn and use

  • convertible to various formats

In short, markdown data is converted to HTML data using the markdown processor which is in turn rendered by the browser. Markdown files have .md extension.

Pasted Graphic 1 copy.jpg

Heading

For heading of various sizes, use the following:

Pasted Graphic 2.png

The above markdown is rendered as follows:

heading1

heading2

heading3

heading4


Text Formatting

Bold Text

To bold a text, wrap it in ** from both sides. For example, the following markdown:

Pasted Graphic 4.png

is rendered as:

Hello World

Italics

To italicize a text, wrap it in * from both sides. For example, the following markdown:

Pasted Graphic 5.png

is rendered as:

I write code

Strikethrough

To strikethrough a text, wrap it in ~~ from both sides. For example, the following markdown:

Pasted Graphic 9.png

is rendered as:

write code.png

Highlight

To highlight a text, wrap it in == from both sides. For example, the following markdown:

Pasted Graphic 5.png

is rendered as:

Pasted Graphic 6.png

Quote

To quote a text, use > infront of the text. For example, the following markdown:

Pasted Graphic 7.png

is rendered as:

write code.png

List

To define an unordered list, use the following markdown:

Pasted Graphic 11.png

The above markdown is rendered as follows:

Pasted Graphic 12.png

To define an ordered list, use the following markdown:

Pasted Graphic 13.png

The above markdown is rendered as follows:

Pasted Graphic 14.png

To define a sub list, use the following markdown:

image.png

The above markdown is rendered as follows:

image.png

We can define a link in Markdown as follows:

image.png

The above markdown is rendered as:

Learn about positioning in CSS

Images

You can add images with a path images.pexels.com/photos/699122/pexels-phot..

Pasted Graphic 16.png

The above image is rendered as:

pexels-tyler-lastovich-699122.jpeg

Code

To add code in Markdown, use the following:

image.png

It will be rendered as:

image.png

I hope that you will find this article insightful. Please share the link with your friends, family, and colleagues.

Did you find this article valuable?

Support Anand by becoming a sponsor. Any amount is appreciated!