마크다운 문법

제 블로그에 맞게 CSS를 약간 커스텀했습니다!

헤더(Headers)

• html 태그 : < h1 > ~ < h6 >

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

h1는 짱크게

h2는 밑줄과 함께

h3는 들여쓰기

h4는 쬐끔 크게

h5는 쬐끔 작게

h6는 ~흐리게~

리스트

• html 태그 : < ol >, < ul >

순서가 있는 리스트(Ordered List)

1. 이렇게 워드에서처럼
2. 번호를 매기면
3. 리스트가 출력됩니다.
4. 또한 중첩 리스트는
    1. 들여쓰기를
    2. 이용하면
    3. 소문자 로마문자로 표기됩니다.
5. 쉽죠?

1. 이렇게 워드에서처럼
2. 번호를 매기면
3. 리스트가 출력됩니다.

4. 또한 중첩 리스트는

   1. 들여쓰기를
   2. 이용하면
   3. 소문자 로마문자로 표기됩니다.
5. 쉽죠?

순서가 없는 리스트(Unordered List)

- 순서 없는 리스트도 워드에서처럼
- 대시를 입력하면됩니다.
* 별이나
+ 플러스 문자도 되네요.
    - 중첩 리스트는 역시
    - 들여쓰기로 표현하면 됩니다.
- 쉽죠?

• 순서 없는 리스트도 워드에서처럼
• 대시를 입력하면됩니다.
• 별이나

• 플러스 문자도 되네요.

  • 중첩 리스트는 역시
  • 들여쓰기로 표현하면 됩니다.
• 쉽죠?

폰트 스타일

• html 태그 : < strong >, < em >, < del >

볼드체(Bold)

**아아메는 진하게** 먹어야 맛있어요.

아아메는 진하게 먹어야 맛있어요.

이탤릭체(Italic)

오늘만은 *삐딱하게*

오늘만은 삐딱하게

취소선(Delete)

역시 정리하는건 즐겁고 ~~힘들고~~ 행복해요.

역시 정리하는건 즐겁고 힘들고 행복해요.

링크와 이미지 걸기(Href, Image src)

• html 태그 : < a href=“https:// ~ ” >, < img src=”./ ~ ” >

링크

[capo의 깃허브](https://github.com/capo-YoonJu)

capo의 깃허브

이미지

![큐티뽀짝 핑구 이미지](./cuty-ppozzak-pingu.jpg)

인용구(Blockquote)

• html 태그 : < blockquote >

> 인용은 이 안에

> 🌟
> 위의 라인 마지막에서 space를 2번 입력하면  
> 이렇게 여러줄로 쓸 수도 있고요,

>- 리스트처럼
>- 다른 마크다운 문법과
>- 함께 쓸 수도 있어요.

인용은 이 안에

🌟
위의 라인 마지막에서 공백 2칸(space를 2번 입력)을 추가하면
이렇게 여러줄로 쓸 수도 있고요,

• 리스트처럼
• 다른 마크다운 문법과
• 함께 쓸 수도 있어요.

체크박스(Checkbox)

• html 태그 : < input type=“checkbox” >

- [ ] google search console에 sitemap, advanced-sitemap 등록
- [x] 페이지 맨 위로 -> 대신에 상단 메뉴 고정시킴
- [x] 게시글 내부 목차리스트 CSS
- [x] 이전글과 다음글 버튼 순서 수정
- [ ] 다크모드 구축
- [x] 마크다운 체크박스 CSS
- [x] 마크다운 인용 태그 CSS
- [ ] hover 수정
- [ ] tags 용도...?

• google search console에 sitemap, advanced-sitemap 등록
• 페이지 맨 위로 -> 대신에 상단 메뉴 고정시킴
• 게시글 내부 목차리스트 CSS
• 이전글과 다음글 버튼 순서 수정
• 다크모드 구축
• 마크다운 체크박스 CSS
• 마크다운 인용 태그 CSS
• hover 수정
• tags 용도…?

코드 블럭(Code Block)

• html 태그 : < code >

인라인 코드 블럭(In-line Code Block)

`System.out.println("HelloWorld!");`

System.out.println("HelloWorld!");

언어 구분 코드 블럭(Language Code Block)

    ```java
    public class LearnMarkdown {
        public static void main(String args[]) {
            System.out.println("HelloWorld!");
        }
    }
    ```

public class LearnMarkdown {
    public static void main(String args[]) {
        System.out.println("HelloWorld!");
    }
}

테이블(Table)

• html 태그 : < code >

과목 | 특징
--- | ---
마크다운 | 표그리기가 제일 귀찮아요,,,
파이썬 | ps는 역시 파이썬이 최고인거 같아요

수평선(Horizontal)

• html 태그 : < hr >

---
***
* * *
- - -
---------------------

요거 ⬆️

부록

숨겨지는 세부사항(Details)

• html 태그 : < details >, < summary >
• 마크다운 문법에는 없고, html 태그를 직접 사용할 경우 세부사항을 숨기는 방식으로 표현할 수 있음

<details markdown="1">
<summary>👀 접기/펼치기</summary>
    뫄뫄~~
</details>

목차(Table of Contents)

    ```toc
    ```