5 min to read
A.K.A Markdown
마크다운에 관하여
🧷아래 글은 작성자가 마크다운을 공부하기 위해 간단히 작성한 메모 형식 게시글입니다
1.0 마크 다운 관련
Markdown 은 텍스트를 HTML 기반의 마크업언어로 2004년 존그루버에 의해 만들어졌다.(HTML 또는XHTML로 변환가능) 특수기호와 문자를 이용한 매우 간단한 구조의 문법을 사용하여 웹에서도 보다 빠르게 컨텐츠를 작성하고 보다 직관적으로 인식할 수 있다. 마크다운 문법은 기존의 여러 text-to-HTML 필터에 영향을 받았지만 그중 텍스트 이메일 형식에서 가장 큰 영감을 받았다. 마크다운은 BSD 오픈 라이언스 기반의 무료 소프트웨어이다. 마크다운이 최근 각광받기 시작한 이유는 깃헙 덕분이다. 깃헙의 저장소(Repository)에 관한 정보를 기록하는 README.md는 깃헙을 사용하는 사람이라면 누구나 가장 먼저 접하게 되는 마크다운 문서였다. 마크다운을 통해서 설치방법, 소스코드 설명, 이슈 등을 간단하게 기록하고 가독성을 높일 수 있다는 강점이 부각되면서 점점 여러 곳으로 퍼져가게 된다.
2.0 마크 다운 사용법
2.1 제목 관련
-
큰제목: 문서 제목
# This is a H1This is a H1
-
작은제목: 문서 부제목
## This is a H2This is a H2
-
글머리: 1~6까지만 지원(되지만..나의 블로그는 H4까지만 되도록 설정해 놓았다.😅)
* # This is a H1
* ## This is a H2
* ### This is a H3
* #### This is a H4
This is a H1
This is a H2
This is a H3
This is a H4
2.2 BlockQuote
이메일에서 사용하는 > 블럭인용문자를 이용한다.
> This is a blockqute.
이 안에서는 다른 마크다운 요소를 포함할 수 있다.
This is a H3
- List
code
2.3 목록(lists)
2.3.1 ● 순서있는 목록(번호)
순서있는 목록은 숫자와 점을 사용한다.
1. 첫번째
2. 두번째
3. 세번째
- 첫번째
- 두번째
- 세번째
현재까지는 어떤 번호를 입력해도 순서는 내림차순으로 정의된다.
1. 첫번째
3. 세번째
2. 두번째
- 첫번째
- 세번째
- 두번째
2.3.2 순서없는 목록(글머리 기호)
* 빨강
* 녹색
* 파랑
+ 빨강
+ 녹색
+ 파랑
- 빨강
- 녹색
- 파랑
- 빨강
- 녹색
- 파랑
- 녹색
- 빨강
- 녹색
- 파랑
- 녹색
- 빨강
- 녹색
- 파랑
- 녹색
혼합해서 사용하는 것도 가능하다.
- 1단계
- 2단계 + 3단계 = 4단계
2.4 코드
2.4.1 inline 코드
텍스트 사이에 `코드` 넣고 싶을때
텍스트 사이에 코드 넣고 싶을때
2.4.1 indent 코드
일반적인 문락입니다:
indent가 적용된 문락입니다.
끝입니다.
실제로 적용해보면, 일반적인 문락입니다:
indent가 적용된 문락입니다. 끝입니다.
2.4.2 Syntax highlighting
코드 관련 내용code element 아래와 같이 사용합니다.
// Example can be run directly in your JavaScript console
// Create a function that takes two arguments and returns the sum of those arguments
var adder = new Function("a", "b", "return a + b");
// Call the function
adder(2, 6);
// > 8
2.5 수평선
아래 줄은 모두 수평선을 만든다. 마크다운 문서를 미리보기로 출력할 때 페이지 나누기 용도로 많이 사용한다.
* * *
***
- - -
---
2.6 링크
2.6.1 * 참조링크
[link keyword][id]
[id]: URL "Optional Title here"
Link: [Google][googlelink]
[googlelink]: https://google.com "Go google"
Link: [Google][googlelink] [googlelink]: https://google.com “Go google”
2.6.2 * 인라인 링크
syntax: [Title](link)
Link: Google
2.6.3 * 자동연결
<http://example.com/>
<address@example.com>
http://example.com/ address@example.com
2.7 강조 문구
2.7.1 mark up language
*텍스트를 기울여서 보여줍니다.*
_텍스트를 기울여서 보여줍니다._
**텍스트를 굵게 보여줍니다**
__텍스트를 굵게 보여줍니다__
++밑줄도 표시 할 수 있습니다++
~~취소선도 표시 가능합니다~~
- 텍스트를 기울여서 보여줍니다.
- 텍스트를 기울여서 보여줍니다.
- 텍스트를 굵게 보여줍니다.
- 텍스트를 굵게 보여줍니다.
- ++밑줄도 칠수 있습니다++
취소선도 표시 가능합니다
2.7.2 강조 문구 html
- 약어 HTML 👉
<abbr> - 기울여진 텍스트 — 기울여진 👉
<cite>. 취소 선👉<del>- 밑줄 선 👉
<ins>. - 서퍼텍스트(superscript) 서브 👉
<sup> - 서브텍스트(subscript) text 👉
<sub>.
2.8 이미지 관련
2.9 Tables
표 사용 방법 입니다.
2.9.1 html
<table>
<thead>
<tr>
<th>이름</th>
<th>표정</th>
<th>설명</th>
</tr>
</thead>
<tfoot>
<tr>
<td>스마일</td>
<td>😀</td>
<td>금요일날 내가 짓는 표정</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>점심</td>
<td>😨</td>
<td>일요일 점심 나의 상태</td>
</tr>
<tr>
<td>카오스</td>
<td>😱</td>
<td>일요일밤 나의 상태</td>
</tr>
<tr>
<td>해골</td>
<td>💀</td>
<td>월요일 아침 나의 상태</td>
</tr>
</tbody>
</table>
| 이름 | 표정 | 설명 |
|---|---|---|
| 스마일 | 😀 | 금요일날 내가 짓는 표정 |
| 점심 | 😨 | 일요일 점심 나의 상태 |
| 카오스 | 😱 | 일요일밤 나의 상태 |
| 해골 | 💀 | 월요일 아침 나의 상태 |
Comments