Markdown 문법
마크다운 (Markdown)은 마크업 언어의 일종이다. 존 그루버(John Gruber)[1]와 아론 스워츠(Aaron Swartz)[2]가 만들었다. HTML 문서 등과 달리, 읽기도 쓰기도 쉬운 문서 양식을 지향한다. 확장자는 .md 또는 .markdown을 사용한다.
github page는 마크다운 언어를 사용하고 있다.
1
2
줄바꿈 : 띄어쓰기 2번, <br>
수평선 : `---` `***`
제목(Header)
1
2
3
4
5
6
7
8
9
10
11
12
# h1
## h2
### h3
#### h4
##### h5
###### h6
h1
====
h2
----
강조
*
, _
, ~
를 사용한다.
1
2
3
4
5
*기울여쓰기*
__굵게__
___기울여굵게___
~~취소선~~
<u>밑줄</u> # html
기울여쓰기
굵게
기울여굵게
취소선
밑줄
리스트(Lists)
Ordered list
번호를 순서대로 쓰지 않아도 알아서 순서대로 정렬됨
1
2
3
1. Firstly
4. Secondly
3. Thirdly
- Firstly
- Secondly
- Thirdly
Unordered list
-
, *
, +
사용
1
2
3
4
- Chapter
- Section
* Paragraph1
+ Paragraph2
- Chapter
- Section
- Paragraph1
- Paragraph2
- Section
ToDo list
1
2
3
4
- [ ] Job
+ [x] Step 1
+ [x] Step 2
+ [ ] Step 3
- Job
- Step 1
- Step 2
- Step 3
Description list
1
2
3
4
궁금
: 설명해야지
설명
: 설명을 써야지
- 궁금
- 설명해야지
- 설명
- 설명을 써야지
표(Tables)
1
2
3
4
5
| Company | Contact | Country |
|:----------------------------:|:-----------------|--------:|
| Alfreds Futterkiste | Maria Anders | Germany |
| Island Trading | Helen Bennett | UK |
| Magazzini Alimentari Riuniti | Giovanni Rovelli | Italy |
| Company | Contact | Country | |:—————————-:|:—————–|——–:| | Alfreds Futterkiste | Maria Anders | Germany | | Island Trading | Helen Bennett | UK | | Magazzini Alimentari Riuniti | Giovanni Rovelli | Italy |
두 번째 줄로 정렬
:– 왼쪽 정렬 :–: 가운데 정렬 –: 오른쪽 정렬
표 내에서 줄 바꿈 <br>
사용
링크(Links)
1
2
3
https://trulyeven.github.io
<https://trulyeven.github.io>
[사이트](https://trulyeven.github.io "over 시 나오는 설명")
https://trulyeven.github.io
https://trulyeven.github.io
사이트
각주(Footnote)
수학(Mathematics)
상단에서 math: true 필요(Chirpy theme)
The mathematics powered by MathJax:
\[\sum_{n=1}^\infty 1/n^2 = \frac{\pi^2}{6}\]When $a \ne 0$, there are two solutions to $ax^2 + bx + c = 0$ and they are
\[x = {-b \pm \sqrt{b^2-4ac} \over 2a}\]차트 및 그래프(mermaid)
상단에서 mermaid: true 필요(Chirpy theme)
classDiagram class Animal Vehicle <|-- Car
flowchart, Sequence Diagram, Class Diagram, State Diagram 등등
이미지(Images)
크기 및 위치
1
2
3
4
5
6
7
8
9
![img-description](/path/to/image){: width="700" height="400" }
{: .normal }
{: .left }
{: .right }
{: .shadow } # 다크모드 X
_Image Caption_ # 위치 지정 시 캡션 추가 불가
# 이미지에 링크 넣기
[![img-description](/path/to/image)](https://kr.vuejs.org/)
Chirpy v5.0.0부터 지원 {: w="700" h="400" }
인용구(Block Quote)
1
> 인용구(Block Quote)
인용구(Block Quote)
코드(Code)
파일 경로 하이라이트 -chirpy
1
`/path/to/a/file.extend`{: .filepath}
/path/to/a/file.extend
Inline Code
1
`인라인 코드`
인라인 코드
코드 블록(Code Block)
1
2
3
```markdown
앞의 {`} 3,4,5 개수로 안밖 블록 구분 가능
```
1
앞의 {`} 3,4,5 개수로 안밖 블록 구분 가능
line number X : plaintext
console
terminal
nolineno
-chirpy
1
2
3
```shell
python, markdown, '...'
```
1
python, markdown, '...'
Liquid Codes
{
{
}
}
,{
%
%
}
문법 사용시
1
2
3
{% if product.title contains 'Pack' %}
This product's title contains the word Pack.
{% endif %}
각주에서 되돌리기
chirpy theme 문법
chirpy theme에서 제공하는 마크다운 문법
Front Matter
chirpy theme 포스트 작성 시 포스트 페이지 맨 위에 작성
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
---
title: TITLE
date: YYYY-MM-DD HH:MM:SS +/-TTTT # timezone
categories: [TOP_CATEGORIE, SUB_CATEGORIE]
tags: [TAG] # 소문자로 작성
img_path: /img/path/ # post에서 쓸 이미지 파일 경로
image: # 미리보기 이미지
path: /path/to/image
width: 1000 # in pixels
height: 400 # in pixels
alt: image alternative text
pin: true # 블로그에 게시물 상단 고정
toc: true # 포스트 옆 헤더 바로가기
comments: true # 댓글 기능
math: true # 수학 공식, 성능 문제로 사용 시에만
mermaid: true # 다이어그램 사용 시
---
프롬프트(prompt) - chirpy theme
1
2
> Example line for prompt.
{: .prompt-info }
prompt-info.
1
2
> Example line for prompt.
{: .prompt-tip }
prompt-tip.
1
2
> Example line for prompt.
{: .prompt-warning }
prompt-warning.
1
2
> Example line for prompt.
{: .prompt-danger }
prompt-danger.