Skip to content

Instantly share code, notes, and snippets.

@ninanung
Last active September 21, 2024 01:52
Show Gist options
  • Save ninanung/73addc0263b34da5f021d2f02a356b7f to your computer and use it in GitHub Desktop.
Save ninanung/73addc0263b34da5f021d2f02a356b7f to your computer and use it in GitHub Desktop.
사실은 내가 보기위한 마크다운 문법설명서 - 2. 리스트와 인용구

2.리스트와 인용구(BlockQuote)

2-1.리스트

리스트는 점점 작은 부분을 설명할 때 사용합니다. 예를 들면

1.사람의 몸
1-1.머리
1-1-1.뇌
뇌는 말랑말랑하다. 그러하다
1-2.다리
1-2-1.발가락
씻을 때는 발가락을 잘 씻자

와 같은 하위 항목을 만드는 것을 말합니다. 방법은 두 가지가 있습니다

  • 숫자가 아닌 방법으로 네모나 동그라미 등으로 표시
  • 1.눈 2.코 3.입 - 와 같은 방법으로 숫자를 표시

먼저 특수문자를 사용하는 경우를 코드로 보여드리겠습니다

* 머리
  * 코
    * 입

+ 머리
  + 코
    + 입

- 머리
- 코
- 입

와 같이 사용합니다. 각각 ‘ * ’ ‘ + ’ ‘ - ’문자를 사용합니다. 한 번 씩만 쓰면 됩니다. 이것은 사용자의 화면에서는

  • 머리
  • 머리
  • 머리

와 같이 보이게 됩니다. 보시면 아시겠지만 ‘tab’키를 사용하지 않으면 구분이 지어지지 않게 됩니다.


다음은 두 번째 방법인 숫자표기 입니다. 먼저 코드를 사용해 보겠습니다.

1. 머리
2. 다리
3. 뚝배기

그저 ‘ 1. ’ 다음에 띄어쓰기를 한 번 하고 내용을 쓰기만 하면 됩니다. 실제 화면은

  1. 머리
  2. 다리
  3. 뚝배기

처럼 보입니다. 그런데 재미있는 것은

1. 머리
3. 뚝배기
5. 다리

이렇게 쓰더라도 결과는 같아집니다. 심지어

1. 머리
4. 뚝배기
2. 다리

이렇게 써도 결과가 같아집니다. 결국 숫자를 무엇을 쓰느냐는 그다지 큰 의미가 없고 순서대로 알아서 숫자를 매깁니다. 참고로

1. 머리
  2. 뚝배기
    3. 다리

이렇게 ‘tab’을 써도 결과는 같습니다. 때문에

1. 머리
  1-1. 머리카락
    1-1-1. 가르마
  1-2. 뒷통수
    1-2-1. 뒷짱구

와 같은 사용도 불가능 합니다. 결국 숫자를 이용한 방법은 그저 순서대로 숫자를 매겨줄 뿐입니다.
그렇다면 2017. 올해 와 같이 그저 숫자뒤에 점을 사용하려고 했다면 어떨까요? 결과는

1. 올해

처럼 나와버립니다. 어떻게 방법이 없을까요? 있습니다.

2017\. 올해

처럼 사용하면 됩니다. 결과는
2017. 올해
처럼 잘 나오게 됩니다. 이 역 슬레시는 다른 문법에 쓰이는 특수문자를 문법으로가 아니라 그냥 화면에 출력하고 싶을 경우에도 사용 가능합니다.

\(특수문자)

식으로 사용합니다.
마지막으로

1. 머리
  * 머리카락
  * 뚝배기
2. 다리
  * 다리털
  * 발가락

와 같이 두가지를 섞어서 사용하는 것도 가능합니다. 결과는

  1. 머리
    • 머리카락
    • 뚝배기
  2. 다리
    • 다리털
    • 발가락

와 같습니다.


2-2.인용구(BlockQuote)

인용구는 위에서 처음에 예시를 들 때 사용했던

으아아아아

와 같은 부분입니다. 말 그대로 어떤 부분을 인용하거나 특수한 강조를 주고 싶을 때 사용합니다.
코드는 다음과 같습니다.

> 어머니 아버지
>> 천원만 주세요
>>> 그렇습니다.

그리고 실제 화면은 이와 같습니다.

어머니 아버지

천원만 주세요

그렇습니다.

보시면 아시겠지만 몇 번이고 겹치는 것이 가능합니다. 제가 몇 번까지 겹쳐지나 해봤는데 여섯 번까지는 겹쳐졌습니다. 그 이상은 잘 모르겠지만 솔직히 그 이상 사용할 일도 없습니다.
참고로 저 인용구 안에는 1장에서 설명했던 제목이나 방금 설명한 리스트를 넣을 수 있습니다. 그 외에 아직 설명하지 않은 텍스트박스도 넣을 수 있습니다. 코드를 보시면

> # this is h1!
> * list
> `textbox`

와 같고 실제로는

this is h1!

  • list
    textbox

와 같이 보이게 됩니다.
여기까지가 리스트와 인용구에 대한 설명이었습니다.

1장. 제목과 호라이즌
2장. 리스트와 인용
3장. 개행과 문자강조
4장. 링크와 이미지넣기
5장. 블럭과 테이블
기스트목록

@jongidal
Copy link

  1. 작업환경
    1. port: 18888

요렇게 앞에 스페이스 4개 넣으면

  1. 작업환경
    i. port: 18888

요렇게 나옵니다.

@inpa-dev
Copy link

그동안 깃헙 마크다운 css가 업데이트 되서 그런지 프리뷰가 약간 다르네요 ㅎㅎ

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment