Post

마크다운 사용법

Posted
By Jihye Ha 8 min read

제목(header)

#을 1~6개까지 사용하여 크기 조절

1
2
3
4
5
6

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

h1

h2

h3

h4

h5
h6



수평선

* 또는 - 또는 _ 를 3개 이상 사용

1
2
3
4
5
6
7
8
9

  ---
  - - -
  -----
  ***
  * * *
  *****
  ___
  _ _ _
  _____



폰트 스타일(기울게/굵게/취소선)

기울여 쓰기 : _ 또는 * 한개 사용
두껍게 쓰기 : _ 또는 * 두개 사용
취소선 : ~ 두개 사용

1
2
3
4
5
6
7
8
9
10
11
12
13

  # 기울여쓰기
  hi _font style_
  hi *font style*

  # 두껍게쓰기
  hi __font style__
  hi **font style**

  # 취소선
  hi ~~font style~~

  # 혼합
  _hi_ ~~font~~ __style__

hi font style
hi font style

hi font style
hi font style

hi font style

hi font style



인용구

> 로 시작하며, > 개수만큼 들여쓰기 가능

1
2
3
4
5

  > # 인용구 test
  >> *인용구 test*
  >>> **인용구 test**
  >>>> ~~인용구~~
  >>>>> ###### 인용구 test

인용구 test

인용구 test

인용구 test

인용구

인용구 test



줄바꿈

<br> 사용
공백 두칸 + 엔터

1
2
3
4
5
6
7
8
9
10

  안녕
  하세요
  ---
  안녕<br>
  하세요<br>
  ---
  안녕<띄어쓰기><띄어쓰기>
  하세요<띄어쓰기><띄어쓰기> 
  ---
  안녕하세요

안녕 하세요

안녕
하세요

안녕
하세요

안녕하세요



단락바꿈

엔터 두번 연속

1
2

  안녕하세요<엔터><엔터>
  반갑습니다

안녕하세요

반갑습니다



순서가 없는 List

* + -를 사용

1
2
3
4
5
6
7
8
9

  * 안녕하세요
    * 순서가 없는 List
      * test 중입니다.
  + 안녕하세요
    + 순서가 없는 List
      + test 중입니다.
  - 안녕하세요
    - 순서가 없는 List
      - test 중입니다.
  • 안녕하세요
    • 순서가 없는 List
      • test 중입니다.
  • 안녕하세요
    • 순서가 없는 List
      • test 중입니다.
  • 안녕하세요
    • 순서가 없는 List
      • test 중입니다.



순서가 있는 List

숫자를 직접 기입해서 사용
각 항목의 숫자와 점 사이에 공백을 넣어야 함
리스트 안 리스트를 사용하려면 Tab과 함께 숫자 1번부터 나열해야 적용됨

1
2
3
4
5
6
7

  1. 사람
  2. 동물
  3. 음식
  4. 과일
    1. 오렌지
  5. 채소
    1. 토마토
  1. 사람
  2. 동물
  3. 음식
  4. 과일
    1. 오렌지
  5. 채소
    1. 토마토



백슬래쉬 이스케이프

특수 문자 그대로를 사용하고자 할 때 문자 앞에 \ 를 사용

1
2
3
4
5

  * 백슬래쉬 이스케이프
  \* 백슬래쉬 이스케이프

  - 백슬래쉬 이스케이프
  \- 백슬래쉬 이스케이프
  • 백슬래쉬 이스케이프

* 백슬래쉬 이스케이프

  • 백슬래쉬 이스케이프

- 백슬래쉬 이스케이프



이미지

이미지 삽입

1
2

  ![대체텍스트](/이미지파일경로)
  ![대체텍스트](이미지파일URL)

1
2

  <img src="이미지파일경로" alt="대체텍스트">
  <img src="이미지파일URL" alt="대체텍스트">

image


이미지 파일에 마우스를 올렸을 때 나오는 텍스트 설정

1
2

  ![대체텍스트](/이미지파일경로 "커서 텍스트")
  ![대체텍스트](이미지파일URL "커서 텍스트")

image


이미지를 눌렀을 때 이동할 URL 설정

1
2

  [![대체텍스트](이미지파일경로)](이동할 URL)
  [![대체텍스트](이미지파일URL)](이동할 URL)

대체텍스트


이미지 캡션

italics 폰트로 작성하면 이미지 캡션을 달 수 있음

1
2

  ![image](/assets/img/background2.jpg)
  _Image Caption_

image Image Caption



이미지 크기 조절

markdown으로 하는 경우 height 조절은 불가

1

  ![image](/assets/img/background2.jpg){: width="150px"}

image

1

  <img src="이미지주소" alt="대체 텍스트" width="150" height="250">

image



링크

외부 링크

1
2
3

  [화면에 표시될 텍스트](링크 URL "마우스를 올렸을 때 보여줄 텍스트")
  [Google](https://www.google.com "구글")
  [Naver](https://www.naver.com "네이버")

Google Naver


내부 링크

#이동할 헤드(제목)을 쓸 때 띄어쓰기는 -로 연결
#이동할 헤드(제목)을 쓸 때 ()괄호와 / 슬래쉬는 입력하지 않음
#이동할 헤드(제목)을 쓸 때 영어는 모두 소문자로 작성

1
2
3

  [화면에 표시될 텍스트](#이동할 헤드(제목))
  [폰트 스타일](#폰트-스타일기울게굵게취소선)
  [순서가 없는 List](#순서가-없는-list)

폰트 스타일 순서가 없는 List



코드 블럭

HTML 속성 사용 불가능(스타일 지정 불가)
주로 일반적인 코드 블록을 나타내는데 사용
백틱 3개를 앞 뒤로 붙여줌
백틱 옆에는 사용한 언어를 명시해줌(생략가능)

``` java
 public class Main {
  public static void main(String[] args){
    System.out.println("Hello, world");
  }
 }
```
1
2
3
4
5

  public class Main {
    public static void main(String[] args) {
        System.out.println("Hello, world!");
    }
  }



체크 리스트

완료된 리스트 표시 : - [x]
미완료된 리스트 표시 : - [ ]

1
2

  - [x] 완료된 리스트
  - [ ] 미완료된 리스트
  • 완료된 리스트
  • 미완료된 리스트



Table 테이블

테이블 생성

헤더와 셀을 구분할 때는 -을 3개 사용 → ---
각 열을 구분 할 때는 | 사용

1
2
3
4

  헤더1|헤더2|헤더3|헤더4
  ---|---|---|---
  칸1|칸2|칸3|칸4
  칸5|칸6|칸7|칸8
헤더1헤더2헤더3헤더4
칸1칸2칸3칸4
칸5칸6칸7칸8


테이블 정렬

헤더의 앞 뒤 중 정렬하고싶은 위치에 :를 붙임
왼쪽 정렬 :---
가운데 정렬 :---:
오른쪽 정렬 ---:

1
2
3
4

  왼쪽 정렬|가운데 정렬|오른쪽 정렬
  :---|:---:|---:
  칸1|칸2|칸3
  칸5|칸6|칸7
왼쪽 정렬가운데 정렬오른쪽 정렬
칸1칸2칸3
칸5칸6칸7
Blog
markdown 마크다운 header 수평선 인용구 목록 이스케이프 이미지 링크 코드블럭 체크리스트 테이블
This post is licensed under CC BY 4.0 by the author.