마크다운(Markdown) 문법 정리

김민철(MInCheol Kim)·2024년 5월 25일
post-thumbnail

1. 마크다운(Markdown)이란?

마크다운(Markdown)은 일반 텍스트 기반의 경량 마크업 언어다. 일반 텍스트로 서식이 있는 문서를 작성하는 데 사용되며, 일반 마크업 언어에 비해 문법이 쉽고 간단한 것이 특징이다. HTML과 리치 텍스트(RTF) 등 서식 문서로 쉽게 변환되기 때문에 응용 소프트웨어와 함께 배포되는 README 파일이나 온라인 게시물 등에 많이 사용된다.
- 위키백과

마크다운의 장단점

  장점

1. 쉽고 직관적이다.
2. 가독성이 좋다.
3. 다양한 플랫폼에서 지원된다.
4. 버전 관리 시스템과 호환성이 좋다. (git/gitHub)

  단점

1. 다른 마크업 언어에 비해 제한된 기능으로 복잡한 레이아웃이나 스타일의 표현이 어렵다.
    -> 이로 인해 HTML을 완전히 대체하기는 어렵다.
2. 표준이 없기 때문에 각 플랫폼 또는 소프트웨어마다 약간의 차이가 있을 수 있다.

2. 마크다운 문법

제목

h1 ~ h6까지 표현할 수 있다. #의 개수를 다르게 하여 작성 가능하다.

#		h1
##		h2     
###		h3
####	h4
#####	h5
######	h6

강조

글자 강조 표현은 굵게(Bold), 이텔릭(Italic), 취소선이 있다.

입력

**굵게**
_이텔릭_
~~취소선~~

출력

굵게
이텔릭
취소선

체크박스

체크박스는 [ ]의 형태로 표현가능하다. 체크표시를 넣으려면 [x]로 표기해야되며 대괄호 앞뒤로 한 칸씩 여백을 입력해야 한다.

수평선

문단 간 구분선으로 사용되는 수평선은 <hr/> 태그를 직접 입력하여 표현할 수 있으며, ***, ---, ___의 기호로도 표현가능하다.

입력

문단1

<hr/>
문단2

***
문단3

---
문단4

___

출력

문단1


문단2

문단3


문단4


블럭인용

>을 인용된 내용을 다루는 문단 앞에 입력한다. 여러 개 중첩이 가능하다.

입력

> 인용 문단
>> 1개 중첩
>>> 2개 중첩

출력

인용 문단

1개 중첩

2개 중첩

코드블럭

코드블럭은 tab 또는 ```으로 작성할 수 있다. 코드가 한 줄이라면 tab 뒤에(앞 줄 개행이 필요함), 코드가 여러 줄이라면 ``` 사이에 작성한다. 코드가 여러 줄일 경우, 사용하는 언어를 기입하여 해당 언어의 syntax highlighting을 반영할 수 있다. 인라인에도 코드 삽입이 가능하다. 코드를 인라인으로 표기하면,

출력문은 print('Hello World!') 형태이다.

처럼 표기된다.

한 줄 예시

입력

(tab) print('Hello World!') ;

출력

print('Hello World!') ;

여러 줄 예시

입력

``` javascript
let sayHi = function () {
	console.log('Hello World!');
    }
sayHi(); ```

출력

let sayHi = function () {
	console.log('Hello World!');
    }
sayHi();

목록

순서 있는 목록

순서 있는 목록은 글머리에 숫자 + . 으로 작성한다. 순서 있는 목록의 경우 작성한 순서에 상관없이 숫자의 내림차순으로 정렬된다. 소항목의 경우 숫자 + ) 으로 작성한다.

입력

1. 첫번째 목록
1) 첫번째 소항목
2) 두번째 소항목
2. 두번째 목록
3. 세번째 목록

출력

  1. 첫번째 목록
    1) 첫번째 소항목
    2) 두번째 소항목
  2. 두번째 목록
  3. 세번째 목록

순서 없는 목록

순서 없는 목록은 글머리에 - / * / +으로 작성한다.

입력

* 치킨
	+ 피자
		- 햄버거

출력

  • 치킨
    • 피자
      • 햄버거

표(테이블)

<table>태그와 같은 표를 작성하기 위해서는 |과 줄바꿈을 통해 행과 열을 구분한다. ---을 통해 헤더를 구분하고 해당 줄에 :을 좌측에 삽입하면 좌측 정렬, :을 우측에 삽입하면 우측 정렬, 양쪽 모두 삽입하면 중앙 정렬이 된다. 셀 내부의 내용에 글자 강조 표시도 적용 가능하다.

|구문        |설명   |비고 |
|:---       |:---:  |---:|
|**Header** |_Title_|1   |
|`Paragraph`|Text   |2   |
구문설명비고
HeaderTitle1
ParagraphText2

이미지 삽입

이미지 삽입은 ![이미지 설명](이미지 소스 URL "이미지 설명")의 형식으로 입력한다.

입력

![이미지 미리보기](https://velog.velcdn.com/images/gener-lst/post/image.png "이미지 미리보기")

출력
포스트 미리보기

링크 삽입

링크 삽입은 바로 링크를 삽입하는 방식과 텍스트에 링크를 거는 방식으로 나뉜다. 이 때, 링크 주소 뒤에 "" 내부에 추가 설명을 작성할 수 있다.

입력

https://velog.io/@gener-lst
[내 velog 바로가기](https://velog.io/@gener-lst "개발자 지망생")

출력

https://velog.io/@gener-lst
내 velog 바로가기

profile
궁금한 건 다 해보는 개발자 지망생

0개의 댓글