문서 작성 방법 markdown

마크다운을 이용한 문서작성

본 싸이트는 문서 작성법으로 마크다운(Markdown) 방식을 이용합니다. 마크다운은 텍스트 기반의 마크업 언어이며, 웹문서인 HTML문서로 쉽고 빠르게 변환이 가능합니다. 특수기호와 문자를 이용한 매우 간단한 구조의 문법을 사용하여 웹에서 보다 빠르고 직관적으로 컨텐츠를 작성할 수 있게 합니다.

ㅇ러니얼ㄹ

1. 단락과 줄바꿈

일반 텍스트를 입력하면 자동으로 하나의 단락으로 인식합니다. 줄바꿈을 하려면 한줄 이상의 빈줄을 추가한 후 새로운 문장을 입력하거나 문장 끝에서 Shift + Return 키를 눌러 줄바꿈을 합니다.

2. 제목

제목은 문장 시작 부분에 < 제목 1 ~ 제목 6> 에 해당하는 해시문자(#)를 추가합니다. 해시기호와 제목사이에는 공백이 있어야 합니다.

제목 1 : #

제목 2 : ##

제목 3 : ###

제목 4 : ####

제목 5 : #####

제목 6 : ######

사용예시 :

# This is an H1

## This is an H2

###### This is an H6

문서변환예시 :

제목1

제목 2

제목 3

제목 4

제목 5

제목 6

3. 인용

인용문을 추가할 경우, 문장 시작부에 우홑화살괄호( > )를 입력합니다. 우홑화살괄호와 인용문 사이에는 공백이 있어야 합니다.

사용예시 :

> 이 문장은 인용문장입니다.
> 이 문장은 인용문장입니다.  
> 이 문장은 인용문장입니다.

인용문 안에서 줄바꿈을 할 경우, 줄바꿈할 위치에서 스페이스키를 이용해 공백을 두번 입력합니다.

문서변환예시 :

이 문장은 인용문장입니다. 이 문장은 인용문장입니다.
이 문장은 인용문장입니다.

4. 목록(Lists)

4.1. 순서목록(ordered list)

1. 항목1 과 같이 입력하면 순서가 지정된 목록을 만듭니다. 목록기호와 항목 사이에는 공백이 있어야 합니다.

사용예시 :

1. 첫째
2. 둘째
3. 셋째

문서변환예시 :

첫째
둘째
셋째

4.2. 비순서목록(un-ordered list)

* 항목1 과 같이 입력하면 순서가 지정되지 않은 목록을 만듭니다. * (별표)는 + 또는 - 기호로 변경할 수 있습니다. 목록기호와 항목 사이에는 공백이 있어야 합니다.

사용예시 :

* 빨강
* 파랑
* 노랑

문서변환예시 :

빨강
파랑
노랑

5. 코드

마크다운 문법에서는 컴퓨터 프로그램 코드와 관련된 기호를 원본 그대로 표시하게 위해서 아포스트로피(apostrophe)를 사용합니다. 본 싸이트에서는 코드를 나타내는 용도 뿐만 아니라 문서의 서지정보를 표기하는 용도로도 사용합니다.

아포스트로피(apostrophe): ` 기호. 키도드에서 tab 키 바로 위의 키입니다.

5.1. 코드박스

코드박스는 여러줄의 코드들을 입력하기 위해 사용합니다. 문장 시작부에 아포스트로피( ` ) 셋을 입력하고 문장 마지막에 다시 아포스트로피 셋을 입력합니다.

사용예시 및 문서변환예시 :

```
function test() {
  console.log("test text");
}
```

5.2. 코드라인

코드라인은 문장 안에서 특정한 코드를 입력하기위해 사용합니다. 지정할 코드에 앞에 아포스트로피 하나를 입력하고 끝에 하나를 입력합니다.

사용예시 :

코드라인은 문장 안에서 특정한 `코드`를 입력하기위해 사용합니다.

문서변환예시 :

코드라인은 문장 안에서 특정한 코드를 입력하기위해 사용합니다.

6. 표(Tables)

표를 만들 때는 수직선(|)을 사용하여 열을 구분하고, 줄바꿈을 통해서 행을 구분합니다. 머리말 행을 만들 때는 빼기기호(-)를 머리말 행 아래 줄에 입력합니다.

수직선: 버티컬바(vertical-bar) 또는 파이프기호라고도 합니다. 키보드에서는 Shifr + \(백슬래쉬) 를 사용하여 입력합니다.

6.1. 표 만들기(2열 3행)

사용예시 :

머리말 A열  | 머리말 B열
--------- | ---------
A열 1행    | B열 1행
A열 2행    | B열 2행
A열 3행    | B열 3행

문서변환예시:

머리말 A열	머리말 B열
A열 1행	B열 1행
A열 2행	B열 2행
A열 3행	B열 3행

6.2. 표 만들기(3열 3행)

사용예시 :

머리말 A열  | 머리말 B열  | 머리말 C열
--------- | --------- | --------
A열 1행    | B열 1행    | C열 1행
A열 2행    | B열 2행    | C열 2행
A열 3행    | B열 3행    | C열 3행

문서변환예시:

머리말 A열	머리말 B열	머리말 C열
A열 1행	B열 1행	C열 1행
A열 2행	B열 2행	C열 2행
A열 3행	B열 3행	C열 3행

7. 각주(Footnotes)

각주를 만들때 사용되는 기호는 대괄호[ ] 와 캐럿기호 ^ 입니다.

각주 번호 지정하기 : 본 문장에서 각주를 달 단어 뒤에 [^각주번호] 이와같은 양식으로 각주번호를 지정합니다.

각주설명 입력하기 : [^각주번호]: 콜론(:)을 추가한 이와같은 양식으로 각주설명을 입력합니다. 콜론 다음에는 공백이 있어야 합니다. 각주 설명은 입력위치와 상관없이 표시될 때는 문서의 가장 하단으로 자동으로 이동합니다.

본 문장의 각주번호를 클릭하면 각주설명으로 이동하고, 각주설명 끝의 ↩ 기호를 클릭하면 본 문장으로 다시 이동합니다.

사용예시 :

우선 각주[^1]를 만들때는 먼저 문장에서 지정된 기호로 각주를 달 단어 뒤에 각주번호를 지정힙니다. 

[^1]: 본 문장과 별도의 문장에서 각주설명을 입력합니다.

문서변환예시:

우선 각주 ¹를 만들때는 먼저 문장에서 지정된 기호로 각주번호를 지정힙니다.

8. 구분선(수평선)

문서에서 위 아래 내용을 구분하는 가로선을 입력할 때는 별표 * 또는 빼기기호- 를 사용합니다. 별표나 빼기기호를 세개 이상 입력하고 줄바꿈하면 구분선이 만들어집니다.

사용예시 :

* * *

***

*****

- - -

---------------------------------------

문서변환예시:

9. 링크(Links)

9.1. 외부링크

9.1.1 외부링크 같은 줄에 입력

문장안에 직접 주소를 입력하여 링크를 연결시킬 수 있습니다.

대괄호와 소괄호를 이용하여 외부링크를 만듭니다.[텍스트](링크주소)

사용예시 :

외부링크 같은 문장 안에 주소를 입력합니다.[구글](https://google.com)로 이동.

문서변환예시:

외부링크 같은 문장 안에 주소를 입력합니다.구글로 이동.

9.1.2 외부링크 다른 줄에 입력

외부링크가 많을 경우 링크주소를 따로 입력할 수 있습니다.

두 대괄호를 이용하여 외부링크를 만듭니다.[텍스트][링크아이디]

사용예시 :

외부링크가 많을 경우 링크주소를 따로 입력할 수 있습니다.[구글][링크아이디]로 이동.

[링크아이디]: https://google.com

문서변환예시:

외부링크가 많을 경우 링크주소를 따로 입력할 수 있습니다.구글로 이동.

9.2. 내부링크

본 싸이트에 존재하는 문서 중 하나로 이동하는 링크를 만들 수 있습니다.

문서편집창 하단의 링크추가 버튼을 클릭하여 주소를 입력하거나,

[텍스트](wiki:/문서의 슬러그) 이러한 형식으로 문서의 슬러그를 직접 입력하여 링크를 만들 수도 있습니다.

사용예시 :

싸이트 홈으로 이동. [홈](wiki:/)

[람림](wiki:/lamrim-index)페이지로 이동

문서변환예시:

싸이트 홈으로 이동. 홈

람림페이지로 이동

10. URLs

URL 을 입력하려면 <꺽쇠갈호>로 URL 주소를 감싸야 합니다.

매일주소 입력 : <example@site.io> example@site.io
URL 주소 입력: <http://google.com> http://google.com

11. 이탤릭체와 볼드체

별표 (*) 또는 언더스코어 (_) 기호 하나로 단어를 앞뒤 공백없이 감싸면 이탤릭체를 입력 할 수 있습니다.

사용예시 :

*single asterisks*  single asterisks

_single underscores_  single underscores

문서변환예시:

single asterisks single asterisks

single underscores single underscores

11.2. 볼드체

별표 (*) 또는 언더스코어 (_) 기호 두개로 단어를 앞뒤 공백없이 감싸면 볼드체를 입력 할 수 있습니다.

사용예시 :

**double asterisks**  double asterisks

__double underscores__  double underscores

문서변환예시:

double asterisks double asterisks

double underscores double underscores

12. 이미지

문서편집창 하단의 이미지들 버튼을 클릭하면 이미지를 업로드하고 문서에 추가할 수 있는 창이 나타납니다.

Video

<iframe width="560" height="315" src="https://www.youtube.com/embed/T3WUJc4i8V4?rel=0&amp;controls=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>

Images

Image looks similar with links, but it requires an additional ! char before the start of link. Image syntax looks like this:

![Alt text](/path/to/img.jpg)

![Alt text](/path/to/img.jpg "Optional title")

You are able to use drag & drop to insert image from image file or we browser. And modify the markdown source code by clicking on the image. Relative path will be used if image is in same directory or sub-directory with current editing document when drag & drop.

For more tips on images, please read http://support.typora.io//Images/

Emphasis

Markdown treats asterisks (*) and underscores (_) as indicators of emphasis. Text wrapped with one * or _ will be wrapped with an HTML  tag. E.g:

*single asterisks*

_single underscores_

output:

single asterisks

single underscores

GFM will ignores underscores in words, which is commonly used in code and names, like this:

wow_great_stuff

do_this_and_do_that_and_another_thing.

To produce a literal asterisk or underscore at a position where it would otherwise be used as an emphasis delimiter, you can backslash escape it:

\*this text is surrounded by literal asterisks\*

Typora recommends to use * symbol.

Strong

double *’s or _’s will be wrapped with an HTML  tag, e.g:

**double asterisks**

__double underscores__

output:

double asterisks

double underscores

Typora recommends to use ** symbol.

Code

To indicate a span of code, wrap it with backtick quotes (`). Unlike a pre-formatted code block, a code span indicates code within a normal paragraph. For example:

Use the `printf()` function.

will produce:

Use the printf() function.

Strikethrough

GFM adds syntax to create strikethrough text, which is missing from standard Markdown.

~~Mistaken text.~~ becomes ~~Mistaken text.~~

Underline

Underline is powered by raw HTML.

Underline becomes Underline.

Emoji :happy:

Input emoji with syntax :smile:.

User can trigger auto-complete suggestions for emoji by pressing ESC key, or trigger it automatically after enable it on preference panel. Also, input UTF8 emoji char directly from Edit -> Emoji & Symbols from menu bar is also supported.

HTML

Typora cannot render html fragments. But typora can parse and render very limited HTML fragments, as an extension of Markdown, including:

Underline: underline
Image: <img src="http://www.w3.org/html/logo/img/mark-word-icon.png" width="200px" /> (And width, height attribute in HTML tag, and width, height, zoom style in style attribute will be applied.)
Comments: 
Hyperlink: <a href="http://typora.io" target="_blank">link</a>.

Most of their attributes, styles, or classes will be ignored. For other tags, typora will render them as raw HTML snippets.

But those HTML will be exported on print or export.

Inline Math

To use this feature, first, please enable it in Preference Panel -> Markdown Tab. Then use $ to wrap TeX command, for example: $\lim_{x \to \infty} \exp(-x) = 0$ will be rendered as LaTeX command.

To trigger inline preview for inline math: input “$”, then press ESC key, then input TeX command, a preview tooltip will be visible like below:

Subscript

To use this feature, first, please enable it in Preference Panel -> Markdown Tab. Then use ~ to wrap subscript content, for example: H~2~O, X~long\ text~/ H~2~O X^2^

Superscript

To use this feature, first, please enable it in Preference Panel -> Markdown Tab. Then use ^ to wrap superscript content, for example: X^2^.

Highlight

To use this feature, first, please enable it in Preference Panel -> Markdown Tab. Then use == to wrap superscript content, for example: ==highlight==.

추가 문법

Lamrim

Blockquotes
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
개행은 개행할 위치에서 스페이스 두 번 입력.
- Blockquotes

blockquote-reverse
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
개행은 개행할 위치에서 스페이스 두 번 입력. blockquote-reverse

badge

label

list-group-item-heading

btn well-lg

well-lg

btn well-sm

well-sm

codeblock

code

본 문장과 별도의 문장에서 각주설명을 입력합니다. ↩