본문 바로가기
개발 팁 정리

[MARKDOWN] 자주 사용하는 마크다운 문법 정리

by minhyeok.lee 2023. 6. 26.
반응형

MARKDOWN(.md), README.md File와 Nextra에서 사용하는 MARKDOWN 주요 문법 정리

 

1. 제목(글머리) 작성

# H1 제목  

## H2 부제목

### H3 소제목

#### H4 제목4

##### H5 제목5

###### H6 제목6

출력결과

제목(글머리) 작성
제목(글머리) 작성

 

2. 번호 없는 리스트 작성

* 리스트1

  - 리스트2

    + 리스트3

    출력결과

번호 없는 리스트 작성
번호 없는 리스트 작성

 

3. 번호 있는 리스트 작성

1. 리스트1

2. 리스트2

3. 리스트3

출력결과

번호 있는 리스트 작성
번호 있는 리스트 작성

 


4. 이텔릭체(기울어진 글씨) 작성

*텍스트*

출력결과

이텔릭체(기울어진 글씨) 작성
이텔릭체(기울어진 글씨) 작성


5. 굵은 글씨 작성

**텍스트**

출력결과

굵은 글씨 작성
굵은 글씨 작성

6. 인용

> 인용1

> 인용2

>> 인용안의 인용

출력결과

인용
인용

 

7. 수평선 넣기

---

출력결과

수평선 넣기
수평선 넣기

8. 링크 달기

(1) 인라인 링크

[블로그 주소](https://kfdd6630.tistory.com/)


(2) 참조 링크

[블로그 주소][blog]


[blog]: https://kfdd6630.tistory.com/

출력결과

링크 달기
링크 달기

 

9. 이미지 추가하기

![이탈리아 포지타노](https://user-images.githubusercontent.com/31477658/85016059-f962aa80-b1a3-11ea-8c91-dacba2666b78.jpeg)


#### 이미지 사이즈 조절

<img src="https://user-images.githubusercontent.com/31477658/85016059-f962aa80-b1a3-11ea-8c91-dacba2666b78.jpeg"  width="700" height="370">


#### 이미지 파일로 추가하기

<img alt="이미지 파일이 없어서 안나옴" src="Image.jpeg" width="700">

출력결과

이미지 추가하기
이미지 추가하기

 

 

10. 코드블럭 추가하기

```js
function XY() {
  const x = 3;
  let y = x + 1;
  return x+y;
}
```

출력결과

코드블럭 추가하기
코드블럭 추가하기

 

11. 기타

**텍스트 굵게**  
~~텍스트 취소선~~

#### [개행]  
스페이스바를 통한 문장개행  
스페이스바를 통한 문장개행  

br태그를 사용한 문장개행
<br>
<br>
br태그를 사용한 문장개행

#### [체크박스]
다음과 같이 체크박스를 표현 할 수 있습니다. 
* [x] 체크박스
* [ ] 빈 체크박스
* [ ] 빈 체크박스

#### [이모지 넣기]
❤️💜💙🤍

#### [표 넣기]
|왼쪽 정렬|가운데 정렬|오른쪽 정렬| 
|:---|:---:|---:| 
|내용1|내용2|내용3| 
|내용1|내용2|내용3|

출력결과

기타
기타

 

반응형

댓글