Code
Code in line
Example: basic: “name
”
options: you can add options featuring as what you want to highlight
just add (primary), (tip), (warning), (success), (danger) with one white space
name (primary)
name (tip)
name (warning)
name (success)
name (danger)
Example of code block
|
|
If you add ‘close’ option into the first line of the code block, you can roll up the code block
3개부터는 애니메이션 효과가 사라집니다.
대신 볼드체로 강조됩니다.
또한 개수가 증가할 수록 글자의 크기가 작아집니다.
As you can see, more than 2 #, it just be bolder and smaller
🥳 이모지 테스트 😤 이모지 테스트
with & without count
- 순서를 세고 싶을 땐
- 넘버링을 하고
- 이런 식으로
- 세지 않을 수도
- 있습니다.
quotation
이것은 인용 예시입니다.
두 line을 개행하여 단락 구분을 할 수도 있고 두 space를 띄워 단락 내 개행을 할 수도 있습니다.기본 인용은 회색으로 표시되며 두 칸을 띄워야 개행이 됩니다.
마찬가지로 옵셥을 추가할 수 있습니다.
primary ‘primary’ 예약어를 사용한 경우입니다.
주요 문단입니다
tip ’tip’ 예약어를 사용한 경우입니다.
팁 문단입니다
warning ‘warning’ 예약어를 사용한 경우입니다.
경고 문단입니다
success ‘success’ 예약어를 사용한 경우입니다.
성공 문단입니다
danger ‘danger’ 예약어를 사용한 경우입니다.
실패(위험) 문단입니다
Photo
Basically, picture has a shadow. so if you don’t want to add it, just add _no
at the end of the text in quotation
-
title with shadow
1
![photo](/images/example.jpeg '제목을 지어주세요')
result:
-
title without shadow
1
![photo](/images/example.jpeg '제목을 지어주세요_no')
result:
-
without title but shadow
1
![photo](/images/example.jpeg)
result:
-
without title and shadow
1
![photo](/images/example.jpeg '_no')
result:
Tap
::: tabs와 :::을 탭 컨테이너의 시작과 끝으로 사용하며, @tab을 사용하여 다양한 탭을 표시하고 구분합니다.
@tab 다음은 제목이며, 기본적으로 첫 번째 탭이 활성화됩니다.
또한, @tab 다음에 텍스트 :active를 추가하여 해당 탭을 기본적으로 활성화할 수 있습니다.
example of tap
-
basic use
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
<!-- 필수 공백 줄 --> ::: tabs <!-- ':::'와 'tabs' 사이에는 반드시 하나의 공백이 있어야 합니다 --> <!-- 필수 공백 줄 --> @tab jay<!-- '@tab'과 제목 사이에는 반드시 하나의 공백이 있어야 합니다 --> <!-- 필수 공백 줄 --> Hi I'm jay! <!-- 필수 공백 줄 --> @tab lay <!-- 필수 공백 줄 --> I'm lay! <!-- 필수 공백 줄 --> @tab kelvin <!-- 필수 공백 줄 --> yeah I'm kelvin! <!-- 필수 공백 줄 --> ::: <!-- 필수 공백 줄 -->
::: tabs
@tab jay
Hi I’m jay!
@tab lay
I’m lay!
@tab kelvin
yeah I’m kelvin!
:::
-
option
:active
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
<!-- 필수 공백 줄 --> ::: tabs <!-- 필수 공백 줄 --> @tab jay <!-- 필수 공백 줄 --> Hi I'm jay! <!-- 필수 공백 줄 --> @tab:active lay <!-- 필수 공백 줄 --> I'm lay! <!-- 필수 공백 줄 --> @tab kelvin <!-- 필수 공백 줄 --> yeah I'm kelvin! <!-- 필수 공백 줄 --> ::: <!-- 필수 공백 줄 -->
::: tabs
@tab jay
Hi I’m jay!
@tab:active lay
I’m lay!
@tab kelvin
yeah I’m kelvin!
:::
-
option
#id
you can add ‘id’ into the tap container and if two containers have same ‘id’, they share tap switching event.1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
<!-- 필수 공백 줄 --> ::: tabs#install <!-- 필수 공백 줄 --> @tab npm <!-- 필수 공백 줄 --> npm을 사용하여 xxx설치 <!-- 필수 공백 줄 --> @tab Homebrew <!-- 필수 공백 줄 --> Homebrew를 사용하여 xxx설치 <!-- 필수 공백 줄 --> @tab MacPorts <!-- 필수 공백 줄 --> MacPorts를 사용하여 xxx설치 <!-- 필수 공백 줄 --> ::: <!-- 필수 공백 줄 -->
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
<!-- 필수 공백 줄 --> ::: tabs#install <!-- 필수 공백 줄 --> @tab npm <!-- 필수 공백 줄 --> npm을 사용하여 yyy설치 <!-- 필수 공백 줄 --> @tab Homebrew <!-- 필수 공백 줄 --> Homebrew를 사용하여 yyy설치 <!-- 필수 공백 줄 --> @tab MacPorts <!-- 필수 공백 줄 --> MacPorts를 사용하여 yyy설치 <!-- 필수 공백 줄 --> ::: <!-- 필수 공백 줄 -->
::: tabs#install
@tab npm
npm을 사용하여 xxx설치
@tab Homebrew
Homebrew를 사용하여 xxx설치
@tab MacPorts
MacPorts를 사용하여 xxx설치
:::
::: tabs#install
@tab npm
npm을 사용하여 yyy설치
@tab Homebrew
Homebrew를 사용하여 yyy설치
@tab MacPorts
MacPorts를 사용하여 yyy설치
:::
mermaid
you can draw graph and flow chart with mermaid.
|
|
flowchart LR
A -- text --> B -- text2 --> C
more usage in here: https://mermaid.js.org/#/
math
- math in line
|
|
행내 공식입니다:\( x = {-b \pm \sqrt{b^2-4ac} \over 2a} \)
- math in block
|
|
블럭 내 공식입니다:$$ x = {-b \pm \sqrt{b^2-4ac} \over 2a} $$
more usage in here: mathjax: https://www.mathjax.org