Web development and Tech news Blog site. WEBISFREE.com

HOME > webdevetc

Learn How to Use Markdown and See Examples

Last Modified : 10 Oct, 2023 / Created : 11 Oct, 2023
125
View Count
Today, we’ll explore Markdown, which is commonly seen in note apps and development documents.



What is Markdown?


Markdown refers to a lightweight markup language that’s both a regular text document and has specific formatting elements such as headers, lists, bold text, and so on. You’ll often encounter files with the .md extension if you install specific apps or libraries. If you open these files with an editor, it displays the internal formatting used, making it easy and quick to understand the content. The screenshot below shows Markdown text on the left and how it appears on the right.

Screenshot) The difference when opening md files in IntelliJ compared to regular text.

The above screenshot clearly demonstrates how Markdown is used. Furthermore, Markdown is often used to create rich text with a regular text editor. Now let’s look at how to use Markdown and its syntax below.

Understanding Basic Markdown Syntax


To express text with specific formatting, it’s essential to know Markdown syntax. There’s a wide variety of syntax like headers, emphasis, lists, etc., but let’s start with the most commonly used headers.



Headers from h1 ~ h6


Firstly, let’s look at how to create headers. In this case, you use the ‘#’ symbol followed by a space and the header text. The ‘#’ symbol can be used from 1 to 6 times, determining the level of the header. Using it once signifies the largest header, while the smallest number represents the lowest header.
# Header 1
## Header 2
### Header 3
#### Header 4
##### Header 5
###### Header 6

Once formatted, typically the largest header appears at the top, with subsequent headers decreasing in size.


Creating Bold and Italic Text


Next, let’s learn how to create bold and italic text for emphasis. To create italic text, use one asterisk or underline. For bold (or thick) text, use two.
*text1* or _text_
**text2** or __text__

It will be displayed as below.
text1
text2


Creating Lists


Now, let’s explore how to create lists. You can make ordered or unordered lists as shown below, using a dash, plus sign, or asterisk for unordered lists, or numbers for ordered lists.

@ Unordered List
- 항목 1
- 항목 2
- 항목 3

@ Ordered List
1. 항목 1
2. 항목 2
3. 항목 3

Note that even if you change the numbers used, the display will still show numbers in the order of 1, 2, 3.


Creating Links


Now, let’s learn how to create link texts in Markdown. Enclose the target text in brackets ‘[ ]’, followed by the URL enclosed in parentheses ‘( )’ to create a hyperlink.
[Webisfree](https://www.webisfree.com)

Now, when you click the text in the document, it will navigate to the corresponding link.


Adding Images


Adding images is also possible. The process is similar to creating links, with the addition of an exclamation mark in front of the link syntax.
![image substitute text](image URL)


Using Table Formatting


Markdown also allows for table formatting. In this case, use the ‘|’ pipeline symbol. For separating table headers from the body, include a row with cell dividers between the header and body. Use the ‘-’ dash symbol along with cell dividers to separate headers from the body. Below is a simple example of table formatting.
| Header1 | Header2 | Header3 |
|-------|-------|-------|
| cell1 | cell2 | cell3 |
| cell4 | cell5 | cell6 |


Creating Code Blocks


You can also create code blocks. Here, we’ll use the backtick symbol to denote code blocks, as we'll see below in more detail.


Using Code Blocks with Markdown


Code blocks come in two styles: inline and block. For inline code, use a single backtick on both sides of the code.

1. Creating Inline Code


You can create inline code as shown below, using a single backtick.
`inline code block`

It will appear as below.
inline code block


2. Creating Multi-line Code Blocks


Use three backticks for code blocks.
```
Code 1
Code 2
Code 3
```


@ Creating Code Blocks for Specific Languages
When creating multi-line code blocks with three backticks, you can specify a language right after the first set of backticks to add syntax highlighting (if supported by the platform). Below is an example of creating a code block for Python.
```python
  def hello_world():
    print("Hello, world!")
```

The example above is a Markdown code block for Python. If supported by the platform, it will appear with the appropriate formatting and highlighting for the specified language.


In Conclusion


We have briefly explored the Markdown language here. Markdown is widely used in popular note-taking apps like Obsidian due to its ease and speed of formatting, making it a well-loved language. Knowing Markdown is very convenient for quick and easy formatting.
Perhaps you're looking for the following text as well?

    Previous

    Quick Look at Using the Header Option with curl

    Previous

    [git] Learn git command fsck