마크다운 문법 정리
마크다운 문법은 너무 쉽고 간단하지만, 매번 사용할때마다 새로운? 느낌을 받았습니다. 먼가 사용을 할때마다 내가 이 문법을 맞게 사용했나 싶기도하고, 항상 찾아보는데 불편함이 있더라구요.
그래서 이번 포스팅에서는 내가 주로 사용하는 MarkDown 문법을 작성해 저장하려고합니다.
줄을 넘기는 방법(개행)
줄을 넘기는 방법은 스페이스로 뒤에 2번이상으로 엔터를 쳐주면됩니다.
첫번째 줄
두번째 줄(스페이스 바 안침)
세번째 줄
첫번째 줄
두번째 줄(스페이스 바 안침)
세번째 줄
이렇게 수행이 됩니다.
heading tag(제목)
주로 제목에 자주 사용하는 태그를 소개합니다. HTML의 heading tag는 MarkDown에서는 '#'을 활용하여 표현합니다.
# this is H1
## this is H2
### this is H3
#### this is H4
##### this is H5
###### this is H6
따로 실행은 하지 않겠습니다. '#'을 쓸수록 작아집니다.
인용구
'>'를 활용하면 인용구를 만들 수 있었습니다. 중첩으로 사용도 가능합니다.
> 중첩1
>> 중첩2
>>> 중첩3
중첩1
중첩2
중첩3
문자 변형(기울기, 굵기,밑줄 등등)
특정 문자에 강조하고 싶은 부분이있다면, 아래와 같이 별 또는 언더바를 사용하여 문자에 변형을 줄 수 있습니다.
*이탈릭체*
_이탈릭체_
**굵은 글씨**
__굵은 글씨__
~~취소선~~
<u>밑줄</u>
_둘다 **사용**_
<center>가운데에 쓰기</center>
이탈릭체
이탈릭체
굵은 글씨
굵은 글씨
취소선
밑줄
둘다 사용
--- ## hr tag(수평선) 수평선을 긋는 hr 태그는 아래 세게중 하나를 3번 연속으로 써주면 됩니다. 많이 쓴다고 지평선이 길어지지는 않습니다. ``` ------ *** _____ ``` ------ *** _____
a tag(하이퍼링크 태그)
마크다운에서는 HTML의 a태그와 동일하게 특정 웹페이지로 이동하는 링크를 적용할 수 있습니다.
방법은 두가지로 특정 웹페이지나 이메일을 보이는대로 링크하는 방법과, 특정 이름으로 바꾸어 링크하는 방법이 있습니다.
<https://github.com/kim-jin-seop>
<tjq2702@naver.com> 꺽새를 활용하면 이렇게 링크를 할 수 있습니다.
[나의 깃블로그](https://kim-jin-seop.github.io/) 이렇게 쓰면 특정 문자에 적용할 수 있습니다.
https://github.com/kim-jin-seop
tjq2702@naver.com 꺽새를 활용하면 이렇게 링크를 할 수 있습니다.
나의 깃블로그 이렇게 쓰면 특정 문자에 적용할 수 있습니다.
img tag(이미지 태그)
이미지를 넣는 방법은 url을 활용하는 방법과 상대주소법을 활용하는 방법이 있습니다.
상대주소법을 사용한다면, 해당 md파일의 위치에서 어느 위치에 이미지가 있는지 쓰면 됩니다.
![대체문구](파일경로)
![대체문구](url)
![대체문구](url)(url2)
이미지가 만약 존재하지않다면, 대체문구가 보여지게됩니다.
만약 뒤에 ()를 붙이고 추가로 url을 작성하게되면 해당 이미지를 클릭시 그 url로 들어가도록 만들어집니다.
리스트(list)
'-', '*', '+'를 활용하여 순서가 없는 리스트를 생성할 수 있습니다. 그리고 'Tab'키를 활용하여 하위항목을 구분할 수 있습니다.
저는 주로 '-'와 '*'을 활용합니다.
* A
* B
* C
* D
+ A
+ B
+ C
- A
- B
- C
- D
- B
- A
- B
- C
순서가 있는 리스트는 단순히 '숫자.'이라는 숫자만 표기하면 됩니다. 단 'Tab'키를 사용해도 하위항목으로 구분이 되지는 않고 단순히 순서만 표기됩니다.
1. A
5. B
2. C
- A
- B
- C
그리고 위 두개를 혼합하여 사용도 가능합니다.
코드블럭(Code)
Code를 작성하고자할 때, 사용합니다. 특정 언어를 써주면 그 언어의 syntax에 따라 IDE로 개발하는 것 처럼 색을 입혀줍니다.
```java
if(true)
System.out.println("Hello MarkDown!");
\`\`\`
if(true)
System.out.println("Hello MarkDown!");
그리고 작게 블럭을 칠 수 도 있습니다.
바로 `하나만 쓰면` 됩니다.
바로 하나만 쓰면
됩니다.
그리고 '`'를 3번쓰셔서 사용하셔도 되고, '~'를 세번 쓰셔서 사용해도 자유입니다.
테이블 만들기(Table)
테이블 만드는 방법은 매우 간단합니다. Html에서 td태그와 tr태그로 복잡하게 계산을 할 필요도 없습니다. 바로 '|'와 '-'를 활용하면 됩니다.
그리고 ':'를 활용하면 정렬을 할 수 있습니다.
| 헤더1 | 헤더2 | 헤더3 |
|: ----------- |: ----------- :| ----------- :|
| 왼쪽정렬 | 가운데정렬 | 오른쪽정렬 |
| 가운데 | | 빈공간 |
| 다 | 채 | 움 |
헤더1 | 헤더2 | 헤더3 |
---|---|---|
왼쪽정렬 | 가운데정렬 | 오른쪽정렬 |
가운데 | 빈공간 | |
다 | 채 | 움 |
이렇게 테이블도 만들 수 있습니다.
동영상 넣기
Markdown에서 가장 불편한 것이 동영상을 넣는 것이라고 생각합니다. 영상을 넣는 방법이 따로 없기때문에, 저는 주로 유튜브를 활용하여 영상을 넣습니다. 저의 유튜브에 영상을 저장하고 iframe 태그를 활용하는 방법을 사용합니다.
영상에 들어가서, 소스 코드 복사
를 클릭합니다.
<iframe width="1044" height="587" src="https://www.youtube.com/embed/eUQFtpxet1k" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
위 처럼 HTML 문법으로 소스코드가 복사가 됩니다. 이 소스코드를 그대로 마크다운에 넣어주면 됩니다.
이렇게 HTML 태그를 활용하여 동영상을 넣을 수 있습니다.
포스팅을 마치며
제가 주로 활용하는 Markdown을 정리하여 포스팅 해보았습니다. HTML에서 사용되던 여러가지 태그들도 활용이 가능합니다!
br 태그를 활용해 줄을 띄우는 방법도 가능하며 img태그를 활용해 이미지를 삽입하는게 모두 가능합니다.
마크다운이 지원하지 않는 부분에 대해서는 HTML의 태그를 사용하면 효과적입니다!
이번 포스팅은 여기까지입니다. 감사합니다.
'Etc > odds and ends' 카테고리의 다른 글
www.google.com url을 검색하면 일어나는 일 (0) | 2021.12.06 |
---|---|
Tistory 블로그 글 쓰면 자동으로 GitHub에 올리기 (0) | 2021.11.06 |
Git Blog에 이미지 업로드 Tip (1) | 2021.07.15 |
uArm 예제를 응용해 바둑돌 두는 동작 구현 (2) | 2019.01.10 |
OpenMV가 바둑돌을 찾아내도록 코드를 구현해봅시다. (0) | 2019.01.04 |