Markdown
일반 텍스트 문서의 양식을 편집하는 문법으로 텍스트에 태그를 이용하여 글자에 속성을 주거나, 이미지를 삽입하고 조작하는 일이 가능하다.
Markdown 장점
- 문법이 간단해 읽고 쓰는게 쉽다.
- 1번의 이유로 글을 빠르게 작성할 수 있다.
간단한 문법만으로도 글을 짜임새있게 작성할 수 있다.
마크다운으로 작성한 글은 그냥 읽어도 이해가 가능하고 HTML로 변환해도 문제가 없다.
키보드만으로 모든 글 작성이 가능하므로 빠르게 작성할 수 있다는 것도 큰 장점이다.
문단 제목
문단 제목을 작성하려면 다음과 같은 방법을 사용하면 된다.
큰제목
===========
부제목
-----------
더 간단한 방법은 #
을 쓰면 된다. (추천)
# 제목
## 제목
#
개수가 많아질수록 글씨 크기가 작아진다.
# H1
## H2
### H3
#### H4
##### H5
###### H6
줄바꿈
마크다운에서 Enter 하나를 입력하면 줄바꿈이 되지 않는다. 줄을 바꾸기 위해서는 <br/>
를 쓸 수도 있으나,
라인의 마지막에 공백 두 칸
을 입력하면 줄바꿈을 할 수 있다.
줄 바꾸는 방법은 라인의 마지막에 공백 두 칸 을 추가
그럼 줄바꿈이 된다.
문단을 구분하려면 Enter를 두번
입력하면 된다.
글을 입력 후 Enter 두 번 입력하여 공백 라인을 추가한다.
문단을 구분할 수 있습니다.
강조
*single asterisks* //이텔릭체
_single underscores_
**double asterisks** //볼드체
__double underscores__
~~cancelline~~
single asteriskssingle underscoresdouble asterisksdouble underscorescancelline
문장 중간에 사용할 경우에는 띄어쓰기를 사용하는것이 좋다.
인용문(Blockquote)
인용문은 >
을 앞에 붙여주면 된다.
> If you can imagine it, you can achieve it; if you can dream it, you can become it.
당신이 상상을 할 수 있다면 그것을 이룰 수 있고, 당신이 꿈꿀 수 있다면 그 꿈대로 될 수 있다.
If you can imagine it, you can achieve it; if you can dream it, you can become it.
당신이 상상을 할 수 있다면 그것을 이룰 수 있고, 당신이 꿈꿀 수 있다면 그 꿈대로 될 수 있다.
순서 있는 목록
순서 있는 목록을 표시할 때는 숫자+마침표(.)를 사용한다.
마침표 뒤에 공백 한 칸을 추가해야 정상적인 문법이다. 만약 공백이 없다면 순서 있는 목록으로 사용되지 않는다.
1. 1번
2. 2번
3. 3번
- 1번
- 2번
- 3번
숫자의 순서와는 상관없이 첫 번째를 기준으로 자동으로 번호가 부여된다.
순서 없는 목록
순서 없는 목록은 , `+`,
세 가지 방법을 사용할 수 있다. 들여쓰기를 하면 하위의 목록으로 만들 수 있다.
* 순서가 없는 목록1
+ 순서 없는 목록1-1
+ 순서 없는 목록1-2
- 순서 없는 목록1-2-1
* 순서가 없는 목록2
* 순서가 없는 목록2-1
* 순서가 없는 목록3
- 순서가 없는 목록1
- 순서 없는 목록1-1
- 순서 없는 목록1-2
- 순서 없는 목록1-2-1
- 순서가 없는 목록2
- 순서가 없는 목록2-1
- 순서가 없는 목록3
들여쓰기
4개의 공백 또는 하나의 탭으로 들여쓰기를 만나면 변환되기 시작하여 들여쓰지 않은 행을 만날때까지 변환이 계속된다.
This is a normal paragraph:
This is a code block.
end code block.
실제로 적용해보면,
ex)
This is a normal paragraph:
This is a code block.
end code block.
주의!
한줄 띄어쓰지 않으면 인식이 제대로 안되는 문제가 발생한다.
This is a normal paragraph:
This is a code block.
end code block.
적용 예)
This is a normal paragraph:
This is a code block.
end code block.
수평선
수평선 을 만들 때는 다음과 같은 방법이 있다. 최소 개수(보통 3개)만 존재하며, 그 이상은 몇개를 써도 상관없다.
***
---
<hr/>
코드블럭
코드블럭은 다음과 같이 2가지 방식을 사용할 수 있다.
- 코드블럭코드 ```
<pre><code>{code}</code></pre>
이용방식
```
public class BootSpringBootApplication {
public static void main(String[] args) {
System.out.println("Hello, Honeymon");
}
}
```
<pre>
<code>
public class BootSpringBootApplication {
public static void main(String[] args) {
System.out.println("Hello, Honeymon");
}
}
</code>
</pre>
링크
링크를 거는 방법은 [링크명](URL)
로 사용하면 된다.그러면 해당 링크명에 입력한 URL로 링크가 걸린다.
[link keyword](url)
ex)
[네이버](naver.com)
문서내 링크걸기
[보여지는 텍스트](#이동할위치의텍스트)
~생략~
#이동할위치의텍스트
와 같이 작성한 뒤 업로드하면,보여지는 텍스트 클릭 시 "#이동할위치의텍스트"로 이동하는 것을 확인할 수 있다.
(기본 링크 작성 방법-텍스트 과 동일하다)
물론 #으로 시작하니까 헤더처리된다.
여기서 이동할위치의텍스트부분을 작성할 때 영어는 반드시 "소문자"만 가능하며 띄어쓰기는 - 로 구분해야한다.
ex)
[Stack](#stack-program)
~생략~
#Stack Program
이미지
![image keyword](/path/img.이미지확장자)
![이미지이름](이미지파일경로)
다른 방법
- 사이즈 조절 기능 시작하기위해선
<img width="" height=""></img>
를 사용한다.
ex)
<img src="/path/to/img.jpg" width="450px" height="300px" title="px(픽셀) 크기 설정" alt="RubberDuck"></img><br/>
<img src="/path/to/img.jpg" width="40%" height="30%" title="px(픽셀) 크기 설정" alt="RubberDuck"></img>
표만들기
| 문자와 - 문자로 표를 만든다
|제목|내용|설명|
|---|---|---|
|테스트1|테스트2|테스트3|
|테스트4|테스트5|테스트6|
|테스트7|테스트8|테스트9|
정렬 사용
: 문자를 사용하여 정렬을 정의할 수 있다.
|제목|내용|설명|
|:---|---:|:---:|
|왼쪽정렬|오른쪽정렬|중앙정렬|
|왼쪽정렬|오른쪽정렬|중앙정렬|
|왼쪽정렬|오른쪽정렬|중앙정렬|
셀 확장
|사이가 비어있으면 자동 확장된다.
|제목|내용|설명|
|:---|:---:|---:|
||중앙에서확장||
|||오른쪽에서 확장|
|왼쪽에서확장||
셀 강조
일반적인 text와 마찬가지로 * 와 ** 를 통해 이탤릭/강조를 표시할 수 있다.
span tag를 사용하면 컬러도 표시할 수 있다.
|제목|내용|설명|
|---|---|---|
|테스트1|*강조1*|테스트3|
|테스트1|**강조2**|테스트3|
|테스트1|<span style="color:red">강조3</span>|테스트3|
토글 리스트 (접기/펼치기)
나는 Notion을 사용했었기 때문에 토글 리스트란 이름이 더 익숙하다. 마크다운에선 지원하지 않고 HTML의 details
태그로 사용 가능하다. div markdown=”1”
은 jekyll에서 html사이에 markdown을 인식 하기 위한 코드이다.
<details>
<summary>여기를 눌러주세요</summary>
<div markdown="1">
😎숨겨진 내용😎
</div>
</details>
- 여기를 눌러주세요
reference
'기타' 카테고리의 다른 글
이것저것 유용한 사이트 (0) | 2021.02.05 |
---|