포스트

Chirpy 블로그 문법

Chirpy 블로그 문법

Chirpy 테마의 마크다운 문법 렌더링 샘플입니다.

제목

1
2
3
4
5
6
7
# H1 - heading

## H2 - heading

### H3 - heading

#### H4 - heading

본문

테스트 글입니다.

리스트

순서 있음

  1. 제육김치덮밥
  2. 돈까스
  3. 돼지국밥

순서 없음

    • 국밥
      • 돼지국밥

To-do

  • 4월 21일 할 일
    • 출근하기
    • 문서 작성하기
    • 딥-수면

설명

수은
수은은 화학 원소로 기호는 Hg, 원자 번호는 80이다. 무겁고 은색의 전이 금속으로, 섭씨 30도 부근에서 액체 상태인 다섯 원소 중 하나이다.
덩이
[명사] 작게 뭉쳐서 이루어진 것.

블럭 인용

_블럭 인용(Block quote)_입니다.

Prompts

정보

주의

위험

CompanyContactCountry
Alfreds FutterkisteMaria AndersGermany
Island TradingHelen BennettUK
Magazzini Alimentari RiunitiGiovanni RovelliItaly

링크

http://127.0.0.1:4000

https://mercury.kr

링크가 걸린 글

각주주

안녕하세요1, 각주입니다2.

본문 내 코드 블럭

본문 내 코드 블럭(Inline Code)의 예시입니다.

파일 경로

/path/to/the/file.extend.

코드 블럭

일반

1
줄 카운팅이나 코드 하이라이팅이 없는 일반적인 코드 블럭입니다.

특정 언어

1
2
3
4
if [ $? -ne 0 ]; then
  echo "The command was not successful.";
  #do the needful / exit
fi;

특정 언어 + 특정 파일 이름

1
2
3
@import
  "colors/light-typography",
  "colors/dark-typography"

수식

다른 곳의 마크다운과 마찬가지로 MathJax을 사용합니다.

\[\sum_{n=1}^\infty 1/n^2 = \frac{\pi^2}{6}\]

$a \ne 0$인 실수 일 때, 방정식 $ax^2 + bx + c = 0$ 은 두 근이 존재하며 근은 아래와 같다.

\[x = {-b \pm \sqrt{b^2-4ac} \over 2a}\]

Mermaid SVG

 gantt
  title  Adding GANTT diagram functionality to mermaid
  apple :a, 2017-07-20, 1w
  banana :crit, b, 2017-07-23, 1d
  cherry :active, c, after b a, 1d

이미지

기본 (캡션 포함)

1
2
![Desktop View](/posts/20190808/mockup.png){: width="972" height="589" }
_기본값은 페이지의 너비를 채우고 가운데 정렬 입니다._

왼쪽 정렬

1
![Desktop View](/posts/20190808/mockup.png){: width="972" height="589" .w-75 .normal}

왼쪽 정렬 및 글 어울림

1
![Desktop View](/posts/20190808/mockup.png){: width="972" height="589" .w-50 .left}

오른쪽 정렬 및 글 어울림

1
![Desktop View](/posts/20190808/mockup.png){: width="972" height="589" .w-50 .right}

다크/라이트 모드 및 그림자

다크 모드 여부에 따라 표시할 이미지를 달리 할 수 있습니다. .shadow 옵션으로 그림에 그림자를 추가할 수 있습니다.

1
2
![light mode only](/posts/20190808/devtools-light.png){: .light .w-75 .shadow .rounded-10 w='1212' h='668' }
![dark mode only](/posts/20190808/devtools-dark.png){: .dark .w-75 .shadow .rounded-10 w='1212' h='668' }

비디오

각주

  1. 첫번째 각주 ↩︎

  2. 두번째 각주 ↩︎

이 글은 저작권자의 CC BY 4.0 라이센스를 따릅니다.