Markdown tutorial fundamental
Markdown is a clean and neat text file for writing HTML without typing HTML that human can read the content easily from source markdown file. HTML is the file for a browser to display the content but human cannot read the content easily.
We assume you have already have VS Code installed and understand how to use Markdown in VS Code https://www.teachonetofish.net/vs-code-markdown-guide/(opens in a new tab.
A comment is a programmer-readable explanation or annotation. Moreover, you can hide some text without deleting the code. Markdown uses standard HTML comment tags.
<!-- This content will not appear -->
Hit once (i.e., insert one newline), then hit it twice (i.e., insert two newlines), see what happens. You’ll soon learn to get what you want. “Markdown Toggle” is your friend
Here's a line for us to start with. This line is separated from the one above by two newlines, so it will be a *separate paragraph*. This line is also a separate paragraph, but... This line is only separated by a single newline, so it's a separate line in the *same paragraph*.
You can create a new paragraph by leaving a blank line between lines of text.
Line 1 Line 2
Three or more Hyphens, Asterisks, Underscores.
--- Hyphens *** Asterisks ___ Underscores
Headers are frequently used on websites to emphasize the importance of the sentence of the coming section.
To create a heading, add one to six # symbols before your heading text. The number of # you use will determine the size of the heading.
# This is header one ## This is header two ### This is header three #### This is header four ##### This is header five ###### This is header six
You can indicate emphasis with bold, italic, strikethrough, subscript, or superscript text in comment fields and .md files.
Just like word, you can make the text bold. Bold the word by adding double asterisk or double underline before and after the words.
This is **bold** and __bold__ text.
Just like word, you can make the text italic. Italic the word by adding single asterisk or single underline before and after the words.
This is *italic* and _italic_ text.
Bold and Italic
If you want to make the word bold and italic, you can add triple asterisk.
This is ***bold and italic*** text.
Just like word, you can strikethrough the text by adding double tilde.
This is ~~strikethrough~~ text.
We can put all together in one sentence.
In Markdown, we can **Bold**, *Italic*, ***All bold and italic*** ~~Strikethrough~~.
You can ignore the Markdown formatting by using \ before the Markdown character. We call that the escape character.
We can escape \**bold\** to \*italic\* by adding \.
We use a
> to add a quote text.
This is not a quote
This is a quote
You can use quoting code to show the text in a sentence or a block of the coding code or output result by a single backticks. You can also press the Command+E (Mac) or Ctrl+E (Windows/Linux) keyboard shortcut to insert the backticks for a code block within a line of Markdown.
This is `quoting code` in a sentence.
You can use quoting code to show the block of the coding code or output result by a triple backticks.
Coding code block:
``` git clone git commit git push ```
git clone git commit git push
To display triple backticks in a fenced code block, wrap them inside quadruple backticks.
```` ``` Look! You can see my backticks. ``` ````
We can add language hint in after the opening backtick to show the code with color refer to that language.
You can create a link by put a http or https link in the text directly or put the link inside the <>(greater than and less than symbol).
If you want to show the link with different text, you can add a link by wrapping link text in brackets [ ], and then wrapping the URL in parentheses ( ) like this.
[Teach One To Fish](https://www.teachonetofish)
You can display an image by adding ! and wrapping the alt text in [ ]. Then wrap the link for the image in parentheses ().
You can make an unordered list by preceding one or more lines of text with symbol *(asterisk), -(minus) or +(plus). No need to be the same symbol within a list.
- Item 1 * Item 2 + Item 3 * Item 4
To order your list, precede each line with a number. Ordering numbers are not important, list will be generated in order but the first item will be the first number.
1. Item 1 2. Item 2 3. Item 3 2. Item 4
You can create a nested list by indenting one or more list items below another item.
1. Item 1 * item 1.1 1. item 1.1.1 1. item 1.1.2 * item 1.2 * item 1.3
Checkbox are created by a hyphen and space followed by [ ]. To check a checkbox by defaul, use [x].
- [ ] Item 1 - [x] Item 2 - [ ] Item 3
You can add emoji to your writing by typing :EMOJICODE:.