🗒 마크다운이란?
마크다운(markdown)은 일반 텍스트 기반의 경량 마크업 언어다. 일반 텍스트로 서식이 있는 문서를 작성하는 데 사용되며, 일반 마크업 언어에 비해 문법이 쉽고 간단한 것이 특징이다. HTML과 리치 텍스트(RTF) 등 서식 문서로 쉽게 변환되기 때문에 응용 소프트웨어와 함께 배포되는 README 파일이나 온라인 게시물 등에 많이 사용된다.
-위키백과
- 쉽게 읽을 수 있고, 쉽게 작성 할 수 있게 만들어졌음.
- README나 온라인 게시물에 많이 사용됨.
1. 제목(Header)
h1부터 h6까지 표현 할 수 있고, #의 개수로 표현이 가능합니다
🖊 마크다운으로 작성 시
# h1
## h2
### h3
#### h4
##### h5
###### h6✔결과
h1
h2
h3
h4
h5
h6
h1, h2는 다른 방법으로도 작성이 가능합니다
=,-를 각각 2개 이상 사용하면 아래와 같이 h1, h2의 #을 대체할 수 있습니다.
여러개를 사용해도 마찬가지입니다.
🖊 마크다운으로 작성 시
h1
==
h2
--
하이픈을 여러 개 사용한 제목
-------------------✔ 결과
h1
h2
하이픈을 여러 개 사용한 제목
2. 문단 간격
문단의 간격은 줄 바꿈으로 나타내고, 여러 번 줄 바꿈시 <br/>을 사용하면 가능합니다.
<br/>은 html에서 사용하는 문법입니다.
🖊 마크다운으로 작성 시
첫 번째 문단 <br/><br/>
두 번째 문단 <br/>
세 번째 문단✔ 결과
첫 번째 문단
두 번째 문단
세 번째 문단
3. 목록
순서를 표기하는 목록 / 순서가 없는 목록 두 가지를 작성할 수 있습니다.
3.1 순서를 표기하는 목록
숫자와 .을 사용하여 작성합니다.
🖊 마크다운으로 작성 시
1. first
2. second
3. thrid✔ 결과
1. first
2. second
3. thrid
3.2 순서가 없는 목록
-, *, + 사용하여 작성합니다 (셋 다 동일하게 적용 됨)
inline code, block code를작성 할 수 있으며, Tab키나 Space bar를 이용해 들여쓰기가 가능합니다.
🖊 마크다운으로 작성 시
- 순서가 없는 목록 1
- 목록 1.1
- 목록 1.2
- 목록 1.3
- 순서가 없는 목록 2
Tab 두번 하면 `code block`을 만들 수 있습니다.
* 순서가 없는 목록 3
* 순서가 없는 목록 4
+ `inline code`
- 들여쓰기(Tab 키를 이용)를 하면 다른 모양으로 표현됩니다.
```
block code
```✔ 결과
- 순서가 없는 목록 1
- 목록 1.1
- 목록 1.2
- 목록 1.3 - 순서가 없는 목록 2
Tab 두번 하면 `code block`을 만들 수 있습니다.
- 순서가 없는 목록 3
- 순서가 없는 목록 4
+inline code
- 들여쓰기(Tab 키를 이용)를 하면 다른 모양으로 표현됩니다.``` block code ```
4. 폰트 스타일
굵기, 기울기, 취소선, 등 기본적은 스타일을 아래와 같이 작성 가능합니다.
🖊 마크다운으로 작성 시
__굵게__
**굵게**
_기울여 쓰기_
*기울여 쓰기*
~취소선~
~~취소선~~✔ 결과
굵게
굵게
기울여 쓰기
기울여 쓰기
~취소선~
취소선
5. 인용문
인용문을 작성할 때에는 >을 사용합니다.
🖊 마크다운으로 작성 시
> 인용문 작성하기
-작성자
> 인용문 작성하기
>> (>)의 갯수에 따라
>>> 중첩문 가능✔ 결과
인용문 작성하기
-작성자
인용문 작성하기
(>)의 갯수에 따라
중첩문 가능
6. inline code
백틱()`을사용하여 inline code를 작성할 수 있습니다.
🖊 마크다운으로 작성 시
`inline code는 이렇게 작성해요.`✔ 결과
inline code는 이렇게 작성해요
7. 여러 줄로 된 code block
```백틱 3개를 사용시 띄어쓰기를 확실하게 하여 code block 설정을 제대로 해야합니다.
🖊 마크다운으로 작성 시
```
위 아래 3개로 감싸면 block으로 만들 수 있어요.
```✔ 결과
위 아래 3개로 감싸면 block으로 만들 수 있어요.💡 코드 하이라이트
🖊 마크다운으로 작성 시
```아래와 같이 백틱 3개 뒤에 언어 이름을 넣어주세요
```python
num_list = ['one', 'two', 'three']
for num in num_list:
print(num)✔ 결과
num_list = ['one', 'two', 'three']
for num in num_list:
print(num)8. 링크(link)
inline 링크와 url 링크, 참조 링크 나타낼 수 있습니다.
🖊 마크다운으로 작성 시
inline 링크는 아래처럼
[inline 링크](http://velog.io/)
url 링크는 아래처럼
<http://velog.io/>
참조 링크는 아래
[velog]:(http://velog.io/)✔ 결과
inline 링크는 아래처럼
inline 링크
url 링크는 아래처럼
http://velog.io/
참조 링크는 아래
9. 수평선
*이나 -,_등을 3개 이상 입력하면 작성할 수 있습니다.
띄어쓰기를 중간에 삽입하여도 가능합니다.
다만, 하이픈-은 헤더로 인식할 수도 있으니 주의해서 사용할 필요가 있습니다.
🖊 마크다운으로 작성 시
***
-------
-- -- -- -- --✔ 결과
10. 이미지 링크
이미지 링크는 아래와 같이 작성할 수 있습니다.
🖊 마크다운으로 작성 시
✔ 결과
만약 이미지에 링크를 걸고 싶은 경우에는 아래와 같이 작성합니다
🖊 마크다운으로 작성 시
[](연결하고자하는 url "마우스 오버 시 나타낼 링크 title")
[](https://velog.velcdn.com/images/m1ng_9/post/d4245c63-3507-405e-8214-635663245101/image.png"이미지 무료 사이트 cat")✔ 결과
[![고양이입니다](](https://velog.velcdn.com/images/m1ng_9/post/d4245c63-3507-405e-8214-635663245101/image.png"이미지 무료 사이트 cat")
중요 ! 이미지 크기는 10MB 이하만 가능합니다. (gif 포함)
사이즈 조절과 관련된 마크다운은 아직 적용이 되어있지 않은 것 같습니다.
11. 테이블(Table)
테이블은 아래와 같이 작성합니다
|로 구분하며 <4. 폰트 스타일> 에서 이야기 했던 기본적인 스타일 적용이 가능합니다
또한 -(하이픈)으로 구분된 곳 각각 왼쪽, 양쪽, 오른쪽 :(세미콜론)을 붙일 경우
순서대로 왼쪽 정렬, 가운데 정렬, 오른쪽 정렬이 가능합니다.
🖊 마크다운으로 작성 시
| 드라마 제목 | 주연 배우 | 방영일 |
|:----------|:---------|:--------|
|**이두나!**| 수지, 양세종 | 2022년 7월 12일 ~ 2023년 2월 20일 |
| 사내 맞선 | 김세정, 안효섭 | 2022년 2월 28일 ~ 2022년 4월 5일 |✔ 결과
| 드라마 제목 | 주연 배우 | 방영일 |
|:----------|:---------|:--------|
|이두나!| 수지, 양세종 | 2022년 7월 12일 ~ 2023년 2월 20일 |
| 사내 맞선 | 김세정, 안효섭 | 2022년 2월 28일 ~ 2022년 4월 5일 |
12. 체크박스(Check Box)
-, *, + 뒤에 띄어쓰기 후 대괄호를 넣어 작성해주세요.
대괄호안에 띄어쓰기를 하면 빈 체크박스, x를 넣으면 체크된 체크박스가 생깁니다.
🖊 마크다운으로 작성 시
- [ ] 운동하기
- [x] 강의 듣기✔ 결과
- 운동하기
- 강의 듣기
13. 이모지⭐
이모지는 트위터 이모지로 https://kr.piliapp.com/twitter-symbols/
복사 붙여넣기로 사용하시면 됩니다
단축키
window10: 윈도우 키 + 마침표(.)
mac: Command + Control + Space Bar
14. 글자 색상
html 태그를 이용하여 작성이 가능합니다.
🖊 마크다운으로 작성 시
<span style="color:red">red</span>
<span style="color:#d3d3d3">#d3d3d3</span>
<span style="color:rgb(245, 235, 13)">rgb(245, 235, 13)</span>✔ 결과
red
#d3d3d3
rgb(245, 235, 13)
글을 마치며,
velog를 시작하면서 Markdown을 작성해보았습니다.
velog는 Markdown 문법을 모두 사용하는 것이 아니기때문에
나중에 보고 사용할 수 있도록 작성해보았습니다.
