itisMilob

Markdown

2024-07-09
블로그를 작성할 때 사용하는 마크다운 문법

마크다운이란?

마크다운(Markdown)은 글을 간단하게 읽고 쓸 수 있도록 개발된 마크업 언어이다.
흔히 깃허브에서 “README.md” 파일을 작성할 때 사용한다.
마크다운 뷰어에 따라 사용할 수 있는 기능이 달라진다.

제목을 쓸 때 사용하는 Header

# 를 사용해 제목을 작성한다.

# Header 1
## Header 2
### Header 3
#### Header 4
##### Header 5
###### Header 6

목록 List

+ , - , * 세 가지 기호를 이용해 구분하여 사용한다.

  • 어쩌고
  • 저쩌고

탭으로 들여쓰기를 사용한다.

  • 어쩌고
    • 저쩌고

순서가 있는 목록은 숫자 1. 를 사용한다.

  1. 어쩌고
  2. 저쩌고
  3. 어쩌고

글자 모양

다양하게 글자 모양을 설정하고 강조할 수 있다.

  • **글자**, ___글자__ : 굵게
  • *글자*, _글자_ : 기울임
  • ~~글자~~ : 가로줄

+ 블로그에서 지원하지 않는 기능

  • $수학 공식$ : $y = x + 1^2$
  • ==글자== : ==강조==

코드

` (backtick-억음 부호)를 사용하여 프로그램 코드를 작성할 수 있다.

1개의 백틱으로 감싸면 한줄 코드를 작성한다.
console.log(10);

3개의 백택으로 감싸면 여러 줄의 코드를 작성한다.

const a = 10;
const b = 20;
console.log(a + b);

3개의 백틱 뒤에 사용 언어를 입력해 문법강조 기능을 사용한다.

``` javascript
const a = 10;
const b = 20;
console.log(a + b);
```
블로그용 클래스 한줄 코드 : code class="language-plaintext highlighter-rouge"
여러줄 코드 : pre class="highlight" > code

인용문

> 를 사용하고, >> 로 들여쓰기가 가능하다.

어쩌고

저쩌고

어쩌고

수평선

---, *** 등을 사용하여 수평선을 그릴 수 있다.

링크

  • 가장 간단한 자동 링크 <https://itismilob.github.io/>
    https://itismilob.github.io/

  • 텍스트에 링크를 삽입하는 방법 [텍스트](링크 URL "주석")
    블로그 홈
    (뒤에 주석을 붙여 호버링 메시지를 띄운다.)

링크를 따로 선언하고, 참조해서 사용할 수 있다. (띄어쓰기 주의)

[블로그 홈]: https://itismilob.github.io/ "블로그 홈으로 이동합니다."
[링크 미리보기][블로그 홈]

이미지

이미지를 넣는 방법은 링크와 비슷하다.
![이미지 이름](이미지 링크 "주석")

이미지

링크와 마찬가지로 따로 선언하고, 참조할 수 있다.

![이미지][참조명]
[참조명]: 이미지 URL "주석"

표, 테이블

간단한 표를 만들 수 있다.

A B C
10 20 30
aa ab ac 
|**A**|**B**|**C**|
|---|---|---|
|10|20|30|
|aa|ab|ac|

HTML 코드

HTML 코드도 직접 입력하여 사용할 수 있다.
주로 토글 버튼을 만들 때 사용한다.

Toggle
  1. 내용1
  2. 내용2
<details>
  <summary>Toggle</summary>
  <ol>
    <li>내용1</li>
    <li>내용2</li>
  </ol>
  <hr />
</details>

백틱을 작성할 때도 사용했다.

<code>`</code>

추가 정보

  • 개행을 할 때는 문장 마지막에 스페이스를 3번 이상 사용해야한다.

  • HTML 내에서 마크다운이 적용되지 않는다.
    하지만 깃허브에서는 <div markdown="1">으로 감싸면 잘 적용된다.

  • 특정 문자를 그대로 보여주고 싶으면 \백슬래시를 앞에 붙인다. (+ - * _)

목차