πŸ’‘ λ§ˆν¬λ‹€μš΄(Markdown) μ‚¬μš©λ²•

μ΅œμ˜ν™˜Β·2022λ…„ 9μ›” 21일
post-thumbnail
  • 자주 보고 νŽΈμ§‘ν•˜λ˜ README.md λŠ” Markdown λ¬Έλ²•μœΌλ‘œ μž‘μ„±λœ 파일
  • κ·ΈλŸ¬λ‚˜ μ‚¬μš©λ²•μ„ λ”°λ‘œ μ •λ¦¬ν•œ 적이 μ—†κΈ° λ•Œλ¬Έμ— Velog λ₯Ό μ‹œμž‘ν•˜λ©° 정리해두렀함

1. 제λͺ©(Header)

  • h1 λΆ€ν„° h6 κΉŒμ§€ ν‘œν˜„ κ°€λŠ₯ν•˜λ©°, #의 κ°œμˆ˜μ— λ”°λΌμ„œ 크기 ν‘œν˜„μ΄ κ°€λŠ₯함
  • #을 λΆ™νžŒ ν›„ spacebar λ₯Ό 눌러 띄어쓰기λ₯Ό ν•΄μ£Όμ–΄μ•Ό 적용이 κ°€λŠ₯함

⌨ μž…λ ₯

# h1
## h2
### h3
#### h4
##### h5
###### h6

πŸ’» κ²°κ³Ό

h1

h2

h3

h4

h5
h6

2. μ€„λ°”κΏˆ(Line Breaks)

  • 띄어쓰기 2번 λ˜λŠ” <br/>둜 ν‘œν˜„ κ°€λŠ₯함

⌨ μž…λ ₯

띄어쓰기 λ‘λ²ˆ  
λ˜λŠ” <br/>

πŸ’» κ²°κ³Ό

띄어쓰기 λ‘λ²ˆ
λ˜λŠ”

3. μˆ˜ν‰μ„ (Horizontal Rule) <hr/>

  • κ°€μ‹œμ μœΌλ‘œ νŽ˜μ΄μ§€λ₯Ό λ‚˜λˆ„λŠ” μš©λ„λ‘œ μ‚¬μš©
  • HTML 의 <hr> νƒœκ·Έμ™€ 같은 μ—­ν• 

⌨ μž…λ ₯

---
***
___
******

πŸ’» κ²°κ³Ό





4. κΈ€μž κ°•μ‘°(Emphasis)

  • 글씨체λ₯Ό λ³€κ²½ν•˜κ±°λ‚˜, μ·¨μ†Œμ„ μ„ κΈ‹κ±°λ‚˜, 밑쀄을 κΈ‹λŠ”λ°μ— μ‚¬μš©

⌨ μž…λ ₯

**ꡡ은 글씨**  
*이텔릭*  
_이타릭_  
~~μ·¨μ†Œμ„ ~~  
<u>밑쀄</u>  
ex)  
This is the **bold** text and this is the *italic* text and <u>let's</u> do ~~strikethrough~~

πŸ’» κ²°κ³Ό

ꡡ은 글씨
이텔릭
이타릭
μ·¨μ†Œμ„ 
밑쀄
ex)
This is the bold text and this is the italic text and let's do strikethrough

5. 인용문(BlockQuote)

  • > 블둝 인용 문자λ₯Ό μ‚¬μš©ν•˜λ©΄ 인용문 ν‘œν˜„μ΄ κ°€λŠ₯

⌨ μž…λ ₯

> 인용문μž₯
>> μ€‘μ²©λœ 인용문
>>> μ€‘μ²©λœ 인용문의 μ€‘μ²©λœ 인용문

πŸ’» κ²°κ³Ό

인용문μž₯

μ€‘μ²©λœ 인용문

μ€‘μ²©λœ 인용문의 μ€‘μ²©λœ 인용문

6. λͺ©λ‘(List)

1) μˆœμ„œκ°€ μ—†λŠ” λͺ©λ‘ (*, +, - 지원)

⌨ μž…λ ₯

- μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
    - μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
        - μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
* μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
    * μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
        * μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
+ μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
    + μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
        + μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘

- μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
    * μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
    + μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘

πŸ’» κ²°κ³Ό

  • μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
    • μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
      • μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
  • μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
    • μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
      • μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
  • μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
    • μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
      • μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
  • μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
    • μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
    • μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘

2) μˆœμ„œκ°€ μžˆλŠ” λͺ©λ‘

⌨ μž…λ ₯

1. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
    1. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
    1. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
1. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘


1. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
    9. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
    3. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
8. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘

πŸ’» κ²°κ³Ό

  1. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
    1. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
    2. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
  2. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
  1. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
    1. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
    2. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
  2. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘

3) ν˜Όν•© μ‚¬μš©

⌨ μž…λ ₯

- μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
    1. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
    1. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
- μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘2
    1. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
    3. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
    8. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘

πŸ’» κ²°κ³Ό

  • μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘
    1. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
    2. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
  • μˆœμ„œκ°€ ν•„μš”ν•˜μ§€ μ•Šμ€ λͺ©λ‘2
    1. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
    2. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘
    3. μˆœμ„œκ°€ ν•„μš”ν•œ λͺ©λ‘

1) 기본방법

  • [Title](link) ν˜•μ‹μœΌλ‘œ μž‘μ„±

⌨ μž…λ ₯

Click [Here](https://velog.io/@longbright_choi)
[길게 λΉ›λ‚˜λŠ” velog](https://velog.io/@longbright_choi)

πŸ’» κ²°κ³Ό

Click Here
길게 λΉ›λ‚˜λŠ” velog

2) μ°Έμ‘° 링크 μ‚¬μš© 방법

  • [link keyword][id]
  • [id]:URL "Optional Title"

⌨ μž…λ ₯

- ex 1) title μ˜΅μ…˜ 없이 μ‚¬μš©
[길게 λΉ›λ‚˜λŠ” velog][yh]
[yh]:https://velog.io/@longbright_choi

- ex 2) title μ˜΅μ…˜ μ‚¬μš© μ‹œ μ»€μ„œλ₯Ό 링크둜 μœ„μΉ˜ν•˜λ©΄ title 이 λ…ΈμΆœλ¨
[길게 λΉ›λ‚˜λŠ” velog][yh]
[yh]:https://velog.io/@longbright_choi "Click Here"

πŸ’» κ²°κ³Ό

3) μžλ™ 링크 μ‚¬μš© 방법

  • 인터넷 URL ν˜Ήμ€ 이메일 μ£Όμ†Œλ₯Ό μ ν•©ν•œ ν˜•μ‹μœΌλ‘œ 링크λ₯Ό μƒμ„±ν•΄μ€Œ

⌨ μž…λ ₯

https://velog.io/@longbright_choi
longbright0804@gmail.com

μœ„μ™€ 같이 μž…λ ₯ μ‹œ 메일 μ£Όμ†Œ 링크 생성이 μ œλŒ€λ‘œ μ•ˆ λ˜μ—ˆλ‹€.
μ•„λž˜μ™€ 같이 μž…λ ₯ ν•΄μ£Όλ©΄ μ œλŒ€λ‘œ 생성이 λ˜μ—ˆλ‹€.

<https://velog.io/@longbright_choi>
<longbright0804@gmail.com>

πŸ’» κ²°κ³Ό

https://velog.io/@longbright_choi
longbright0804@gmail.com

μœ„μ™€ 같이 μž…λ ₯ μ‹œ 메일 μ£Όμ†Œ 링크 생성이 μ œλŒ€λ‘œ μ•ˆ λ˜μ—ˆλ‹€.

https://velog.io/@longbright_choi
longbright0804@gmail.com

8. 이미지(Images)

  • Link 와 문법이 μœ μ‚¬ν•¨. μ•žμ— ! 만 μΆ”κ°€ν•˜λ©΄ 됨

1) 기본문법

  • ![λŒ€μ²΄ ν…μŠ€νŠΈ](이미지 μ£Όμ†Œ)

⌨ μž…λ ₯

![Image Description](https://velog.velcdn.com/images/longbright_choi/post/47ae0367-ceab-4348-8c20-b330257b78cf/image.png)

πŸ’» κ²°κ³Ό

Image Description

2) μ°Έμ‘° 링크 μ‚¬μš© 방법

  • :[λŒ€μ²΄ ν…μŠ€νŠΈ][id]
  • `[id]:μ΄λ―Έμ§€μ£Όμ†Œ "Optional Title"

⌨ μž…λ ₯

![Image Description][karina]
[karina]:(https://velog.velcdn.com/images/longbright_choi/post/47ae0367-ceab-4348-8c20-b330257b78cf/image.png) "Click Here"

πŸ’» κ²°κ³Ό

Image Description

3) 이미지 λ…ΈμΆœκ³Ό λ™μ‹œμ— 링크처리

  • [![λŒ€μ²΄ν…μŠ€νŠΈ](이미지 μ£Όμ†Œ)](링크 μ£Όμ†Œ)

⌨ μž…λ ₯

![[Image Description](https://velog.velcdn.com/images/longbright_choi/post/47ae0367-ceab-4348-8c20-b330257b78cf/image.png)](https://velog.velcdn.com/images/longbright_choi/post/47ae0367-ceab-4348-8c20-b330257b78cf/image.png)

πŸ’» κ²°κ³Ό

[Image Description](https://velog.velcdn.com/images/longbright_choi/post/47ae0367-ceab-4348-8c20-b330257b78cf/image.png)

9. ν‘œ(Table)

  • | (Vertical bar) 기호λ₯Ό 톡해 ν…Œμ΄λΈ” ν‘œν˜„ κ°€λŠ₯(κ°€μž₯ 쒌츑, 우츑 μƒλž΅ κ°€λŠ₯
  • 헀더와 셀을 ꡬ뢄할 λ•Œ 3개 μ΄μƒμ˜ - κ°€ ν•„μš”
  • : 기호λ₯Ό 톡해 μ •λ ¬ κ°€λŠ₯

⌨ μž…λ ₯

| Header | value | Description |
| --: | :-- | :--: |
| μ •λ ¬ | --: | μš°μΈ‘μ •λ ¬ |
| μ •λ ¬ | :-- | μ’ŒμΈ‘μ •λ ¬ |
| μ •λ ¬ | :--: | κ°€μš΄λ°μ •λ ¬ |

πŸ’» κ²°κ³Ό

HeadervalueDescription
μ •λ ¬--:μš°μΈ‘μ •λ ¬
μ •λ ¬:--μ’ŒμΈ‘μ •λ ¬
μ •λ ¬:--:κ°€μš΄λ°μ •λ ¬

10. μ½”λ“œ(Code)

1) 인라인 μ½”λ“œ(Inline Code)

  • λ°±ν‹±(`) 으둜 κ°μ‹Έμ„œ ν‘œν˜„ κ°€λŠ₯

⌨ μž…λ ₯

`μΈλΌμΈμ½”λ“œ(Inline Code)`

πŸ’» κ²°κ³Ό

μΈλΌμΈμ½”λ“œ(Inline Code)

2) 블둝 μ½”λ“œ(Block Code)

  • λ°±ν‹±(```) 으둜 κ°μ‹Έμ„œ ν‘œν˜„ κ°€λŠ₯
  • 일반적으둜 λ°±ν‹±(```) μ˜†μ— μ½”λ“œμ˜ μ’…λ₯˜λ₯Ό λͺ…μ‹œν•˜μ—¬ μ‚¬μš©ν•¨

⌨ μž…λ ₯

  • Java
```java
public class Main {
	public static void main(String [] args) throws Exception {
    System.out.println("Hello World");
    }
}
  • python
```python
def helloWorld():
	print(f'Hello World')
  • javascript
``` javascript
const name = "μ΅œμ˜ν™˜";
console.log("Hello World");
console.log(name);
  • bash
``` bash
$ ls -al

πŸ’» κ²°κ³Ό

  • Java
public class Main {
	public static void main(String [] args) throws Exception {
    System.out.println("Hello World");
    }
}
  • python
def helloWorld():
	print(f'Hello World')
  • javascript
const name = "μ΅œμ˜ν™˜";
console.log("Hello World");
console.log(name);
  • bash
$ ls -al

11. μ›μ‹œ HTML (Raw HTML)

  • Makrdown ν™˜κ²½μ—μ„œλŠ” κ²°κ΅­ ν‘œν˜„μ˜ ν•œκ³„κ°€ 있으며, 이런 경우 HTML 문법 μ‚¬μš©μ΄ κ°€λŠ₯함

⌨ μž…λ ₯

ex) imageλ₯Ό ν‘œν˜„ν•  λ•Œ MarkDownμœΌλ‘œλŠ” width 지정이 λΆˆκ°€λŠ₯ 함
<img width="70" src="https://velog.velcdn.com/images/longbright_choi/post/47ae0367-ceab-4348-8c20-b330257b78cf/image.png" alt="karina" />

ex) 링크λ₯Ό ν‘œν˜„ν•  λ•Œ target="_blank" 지정이 λΆˆκ°€λŠ₯ 함
링크 클릭 μ‹œ ν˜„μž¬ μ°½μ—μ„œ 링크λ₯Ό λ„μ›Œμ€€λ‹€.

ex) 밑쀄을 ν‘œν˜„ν•  수 μ—†μ–΄ <u></u>λ₯Ό μ‚¬μš©ν•˜κ±°λ‚˜ λ‹€μŒκ³Ό 같이 style을 직접 μ§€μ • ν•΄μ€˜μ•Ό ν•œλ‹€.
<span style="text-decoration: underline;">μΉ΄λ¦¬λ‚˜</span> 사진이닀.
<u>μΉ΄λ¦¬λ‚˜</u> 사진이닀.

πŸ’» κ²°κ³Ό

ex) imageλ₯Ό ν‘œν˜„ν•  λ•Œ MarkDownμœΌλ‘œλŠ” width 지정이 λΆˆκ°€λŠ₯ 함
karina

ex) 링크λ₯Ό ν‘œν˜„ν•  λ•Œ target="_blank" 지정이 λΆˆκ°€λŠ₯ 함
링크 클릭 μ‹œ ν˜„μž¬ μ°½μ—μ„œ 링크λ₯Ό λ„μ›Œμ€€λ‹€.

ex) 밑쀄을 ν‘œν˜„ν•  수 μ—†μ–΄ λ₯Ό μ‚¬μš©ν•˜κ±°λ‚˜ λ‹€μŒκ³Ό 같이 style을 직접 μ§€μ • ν•΄μ€˜μ•Ό ν•œλ‹€.
μΉ΄λ¦¬λ‚˜ 사진이닀.
μΉ΄λ¦¬λ‚˜ 사진이닀.

profile
쑰금 λŠλ¦΄κ²Œμš”~

0개의 λŒ“κΈ€