마크다운이란?
마크다운(markdown)은 일반 텍스트 기반의 경량 마크업 언어다. 일반 텍스트로 서식이 있는 문서를 작성하는 데 사용되며, 일반 마크업 언어에 비해 문법이 쉽고 간단한 것이 특징이다. HTML과 리치 텍스트(RTF) 등 서식 문서로 쉽게 변환되기 때문에 응용 소프트웨어와 함께 배포되는 README 파일이나 온라인 게시물 등에 많이 사용된다.
-위키백과
- 쉽게 읽을 수 있고, 쉽게 작성할 수 있게 만들어짐
- 가독성이 제일 중요
- 웹상에서 사용할 수 있는 글쓰기 도구
- html을 완전하게 대체하지는 못함
📌 Block Elements
📖 제목(headers) 넣어보기
h1부터 h6을 이용해서 제목을 표현할 수 있다
참고: 회색 박스로 감싸진 부분은 백틱(backtick)(``)으로 감싸서 작성하면 된다.
✍ 입력
# 첫 번째 수준 제목 (h1)
## 두 번째 수준 제목 (h2)
### 세 번째 수준 제목 (h3)
#### 네 번째 수준 제목 (h4)
##### 다섯 번째 수준 제목 (h5)
###### 여섯 번째 수준 제목 (h6)💻 출력
첫 번째 수준 제목 (h1)
두 번째 수준 제목 (h2)
세 번째 수준 제목 (h3)
네 번째 수준 제목 (h4)
다섯 번째 수준 제목 (h5)
여섯 번째 수준 제목 (h6)
📖 인용(Blockquotes)
본문 안에서 인용된 내용을 표시하고자 한다면 > 기호를 사용한다.
✍ 입력
> # 1단
인용문 첫 번째 줄
인용문 두 번째 줄
인용문 세 번째 줄
>> ## 2단
중복해서 사용하면
>>> ### 3단
중첩 인용문을 표현할 수 있다
>>>> #### 4단
계속 중첩할 수 있다
참고: 인용문 안에서 제목 수준을 표현할 수도 있다.💻 출력
1단
인용문 첫 번째 줄
인용문 두 번째 줄
인용문 세 번째 줄2단
중복해서 사용하면
3단
중첩 인용문을 표현할 수 있다
4단
계속 중첩할 수 있다
📖 리스트
일반적인 불릿 리스트는 *, +, - 중 아무 기호나 이용하면 된다.
✍ 입력
* 별도
+ 플러스도
- 마이너스도 똑같이 나온다💻 출력
- 별도
- 플러스도
- 마이너스도 똑같이 나온다
숫자 리스트는 숫자 +, 마침표(.)를 이용하면 된다.
✍ 입력
1. 1번
2. 2번
6. 3번
3. 4번
4. 5번💻 출력
1. 1번
2. 2번
6. 3번
3. 4번
4. 5번
참고: 숫자 리스트는 순서가 맞지 않아도 자동으로 순서가 맞춰진다.
리스트 안에서 이어지는 문단을 추가할 때는 스페이스바만 입력해줘도 된다.
✍ 입력
- 첫 번째 리스트
이어지는 두 번째 문단
- 두 번째 리스트
이어지는 두 번째 문단💻 출력
-
첫 번째 리스트
이어지는 두 번째 문단
-
두 번째 리스트
이어지는 두 번째 문단
📖 코드블럭(Code Blocks) 만들어보기
한 줄짜리 코드블럭은 Tab을 이용해서 작성할 수 있다.
다만, 이전 문장으로부터 엔터를 두 번 입력해야만 가능하다.여러 줄의 코드 블럭은 백틱(``) 3개로 감싸서 작성한다.
여러 줄의 코드 블럭은
3개의 백틱으로
감싸서 만들 수 있다✍ 입력
```#include <stdio.h>
int main()
{
printf("Hello, world!\n");
return 0;
}```💻 출력
#include <stdio.h>
int main()
{
printf("Hello, world!\n");
return 0;
}✍ 입력
```python
print("hello world")```💻 출력
print("hello world")✍ 입력
```java
public class helloWorld{
public void main(String[] args) {
System.out.println("Hello World");
}
}```💻 출력
public class helloWorld{
public void main(String[] args) {
System.out.println("Hello World");
}
}코드블럭 시작점에 사용하는 언어를 선언하면 Syntax Highlighting이 가능하다.
| 언어 이름 | 작성 방식 |
|---|---|
| Bash | bash |
| C | c |
| C# | cs |
| C++ | cpp |
| CSS | css |
| Diff | diff |
| HTML, XML | html |
| HTTP | http |
| Ini | ini |
| JSON | json |
| Java | java |
| JavaScript | javascript |
| PHP | php |
| Perl | perl |
| Python | python |
| Ruby | ruby |
| SQL | sql |
출처: 마크다운 왕초보 코드블록 사용가능한 언어 목록
📖 가로선 넣기
가로선을 넣기 위한 다양한 방법이 있는데, 아래의 입력 방식은 모두 동일한 가로선을 만들어준다.
✍ 입력
* * *
***
*****
- - -
---
-----
_ _ _
___
_____💻 출력
📌 Span Elements
📖 링크 서식(Links)
아래 3가지 방식으로 링크를 나타낼 수 있다.
- 인라인 링크
- url 링크
- 참조 링크
✍ 입력
인라인 링크
[인라인 링크](https://velog.io/)
url 링크
<https://velog.io/>
참조 링크
[velog]:https://velog.io/
[velog]💻 출력
인라인 링크
velog <- 키워드를 참조하는 방식
📖 강조하기(Emphasis)
볼드, 이탤릭, 취소선을 사용할 수 있다.
✍ 입력
*이탤릭*
_이탤릭_
**볼드**
__볼드__
~~취소선~~💻 출력
이탤릭
이탤릭
볼드
볼드
취소선
📖 이미지 삽입(Images)
1. 일반 이미지 삽입하기: 
예시: 
2. 이미지에 설명 삽입하기: 
예시: 
** 참고: 이미지에 마우스를 올렸을 때 나타나는 설명을 의미함
3. 이미지에 링크 걸기: [](연결할 url "url 설명 문구")
예시: [](https://cdn.pixabay.com/photo/2015/03/26/09/47/sky-690293_1280.jpg "Pixabay Image")📌 MISCELLANEOUS
📖 기호 표시(Backslash Escapes)
마크다운 문법에 있는 기호를 그대로 출력하고 싶다면, 역방향 슬래시를 앞에 붙여주면 된다.
✍ 입력
\*
\_
\()
\{}
\[]
\#
\+
\-
\.
\!
\\💻 출력
*
_
()
{}
[]
#
+
-
.
!
\
📖 테이블(Table)
- 수직선 기호(|)로 열을 구분할 수 있다
- 하이픈 기호(-)를 여러 개 붙여서 th와 tr을 구분할 수 있다.
- 콜론 기호(:)로 정렬을 표현할 수 있다.
✍ 입력
| |left |center|right
|----|:----|:----:|----:
|row1|l1 | c1 | r1
|row2|l2 | c2 | r2
|row3|l3 | c3 | r3💻 출력
| left | center | right | |
|---|---|---|---|
| row1 | l1 | c1 | r1 |
| row2 | l2 | c2 | r2 |
| row3 | l3 | c3 | r3 |
📖 이모지(Emoji)
- 링크에서 복사+붙여넣기: https://kr.piliapp.com/twitter-symbols/
- 단축키 이용:
windows:윈도우 키+마침표(.)
mac:Command+Control+Space Bar
📖 체크박스(Check Box)
*, +, - 기호 뒤에 띄어쓰기 이후 대괄호[]를 넣어 작성한다.
띄어쓰기를 하면 체크되지 않은 상태이고,
x를 입력해주면 체크된 상태가 된다.
✍ 입력
- [ ] 체크되지 않은 박스
- [x] 체크된 박스💻 출력
- 체크되지 않은 박스
- 체크된 박스
End
마크다운 문법을 정리하면서 참고한 사이트!!
https://velog.io/@yuuuye/velog-마크다운MarkDown-작성법
https://daringfireball.net/projects/markdown/syntax
