GitLab Flavored Markdown (GLFM)

Tier: Free, Premium, Ultimate Offering: GitLab.com, Self-Managed, GitLab Dedicated
  • 약어 변경 14.10 버전에서 GFM에서 GLFM으로 변경되었습니다.

GitLab UI에 텍스트를 입력하면, GitLab은 해당 텍스트가 Markdown 언어로 작성된 것으로 간주합니다. 이 텍스트는 일련의 스타일로 렌더링됩니다. 이러한 스타일을 GitLab Flavored Markdown라고 합니다.

예를 들어, Markdown에서 순서 없는 목록은 다음과 같이 표시됩니다:

- 고양이
-- 거북

이 목록이 렌더링되면 다음과 같이 보입니다:

  • 고양이
  • 거북

참고: 이 Markdown 사양은 GitLab 전용 유효하므로, GitLab에서 보이는 스타일로 보기를 참조하십시오.

GitLab Flavored Markdown을 사용하는 장소는 다음과 같습니다:

  • 코멘트
  • 이슈
  • 에픽
  • 머지 리퀘스트
  • 마일스톤
  • 스니펫 (스니펫의 확장자를 .md로 지정해야 함)
  • 위키 페이지
  • 저장소 내부의 Markdown 문서

또한 GitLab에서 다른 리치 텍스트 파일을 사용할 수도 있습니다. 이를 위해서 종속성을 설치해야 할 수 있습니다. 자세한 정보는 gitlab-markup gem 프로젝트를 참조하십시오.

GitLab Flavored Markdown과 표준 Markdown의 차이점

GitLab Flavored Markdown은 다음으로 구성됩니다:

모든 표준 Markdown 서식은 GitLab에서 예상대로 작동해야 합니다. 표준 기능 중 일부는 표준 사용에 영향을 미치지 않으면서도 추가 기능으로 확장됩니다.

다음 기능은 표준 Markdown에는 없습니다:

다음 기능은 표준 Markdown에서 확장되었습니다:

표준 Markdown GitLab에서 확장된 Markdown
인용 다중 라인 인용문
코드 블록 색상 지정 코드 및 구문 강조
헤딩 링크 가능한 헤딩 ID
이미지 내장된 비디오오디오
링크 자동으로 링크된 URL

Markdown 및 접근성

GitLab Flavored Markdown을 사용할 때, 디지털 콘텐츠를 작성하고 있습니다. 이 콘텐츠는 대상 관객에게 최대한 접근성 있게 제공되어야 합니다. 다음 목록은 완전한 것은 아니지만, 특히 주의해야 할 GLFM 스타일을 위한 지침을 제공합니다:

접근성 있는 헤딩

논리적인 헤딩 구조를 만들기 위해 헤딩 서식을 사용합니다. 페이지의 헤딩 레벨 구조는 좋은 목차처럼 의미가 있도록 구성되어야 합니다. 페이지에 h1 요소가 하나만 있고, 헤딩 레벨이 건너뛰지 않고 올바르게 중첩되어 있는지 확인합니다.

접근성 있는 테이블

테이블의 접근성과 탐색할 수 있는 상태를 유지하기 위해 테이블에는 빈 셀이 없어야 합니다. 셀에 의미 있는 값이 없는 경우에는 “해당 없음”의 경우에는 N/A를 입력하거나 없음을 고려합니다.

접근성 있는 이미지 및 비디오

이미지 또는 비디오에 [대체 텍스트]로 설명을 추가합니다. 설명은 정확하고 간결하며 고유해야 합니다. 설명에 image of 또는 video of를 사용하지 않습니다. 자세한 내용은 WebAim 대체 텍스트를 참조하십시오.

색상

GitLab에서 이 주제 보기.

Markdown은 텍스트 색상을 변경하는 것을 지원하지 않습니다.

HEX, RGB, 또는 HSL 형식으로 색상 코드를 작성할 수 있습니다.

  • HEX: `#RGB[A]` 또는 `#RRGGBB[AA]`
  • RGB: `RGB[A](R, G, B[, A])`
  • HSL: `HSL[A](H, S, L[, A])`

네임드 색상은 지원되지 않습니다.

GitLab 앱에서(backtick) 색상 코드는 색상 코드 옆에 색칩으로 표시됩니다. 예를 들어:

- `#F00`
- `#F00A`
- `#FF0000`
- `#FF0000AA`
- `RGB(0,255,0)`
- `RGB(0%,100%,0%)`
- `RGBA(0,255,0,0.3)`
- `HSL(540,70%,50%)`
- `HSLA(540,70%,50%,0.3)`
  • #F00
  • #F00A
  • #FF0000
  • #FF0000AA
  • RGB(0,255,0)
  • RGB(0%,100%,0%)
  • RGBA(0,255,0,0.3)
  • HSL(540,70%,50%)
  • HSLA(540,70%,50%,0.3)

다이어그램 및 플로차트

텍스트에서 다이어그램을 생성할 수 있습니다. 다음을 사용해보세요:

위키에서는 diagrams.net 편집기로 생성된 다이어그램을 추가하고 편집할 수도 있습니다.

Mermaid

  • 엔터티 관계 다이어그램 및 마인드맵을 지원합니다. 소개됨 GitLab 16.0에서.

GitLab에서 이 주제 보기.

자세한 내용은 공식 페이지를 방문하세요. Mermaid Live Editor를 사용하여 Mermaid를 학습하고 코드의 문제를 해결하세요.

다이어그램이나 플로차트를 생성하려면 mermaid 블록 안에 텍스트를 작성하세요:

```mermaid
graph TD;
  A-->B;
  A-->C;
  B-->D;
  C-->D;
```
graph TD; A-->B; A-->C; B-->D; C-->D;

서브그래프를 포함할 수도 있습니다:

```mermaid
graph TB

  SubGraph1 --> SubGraph1Flow
  subgraph "SubGraph 1 Flow"
  SubGraph1Flow(SubNode 1)
  SubGraph1Flow -- Choice1 --> DoChoice1
  SubGraph1Flow -- Choice2 --> DoChoice2
  end

  subgraph "Main Graph"
  Node1[Node 1] --> Node2[Node 2]
  Node2 --> SubGraph1[Jump to SubGraph1]
  SubGraph1 --> FinalThing[Final Thing]
end
```
graph TB SubGraph1 --> SubGraph1Flow subgraph "SubGraph 1 Flow" SubGraph1Flow(SubNode 1) SubGraph1Flow -- Choice1 --> DoChoice1 SubGraph1Flow -- Choice2 --> DoChoice2 end subgraph "Main Graph" Node1[Node 1] --> Node2[Node 2] Node2 --> SubGraph1[Jump to SubGraph1] SubGraph1 --> FinalThing[Final Thing] end

PlantUML

PlantUML 통합이 GitLab.com에서 활성화되었습니다. PlantUML을 자체 관리 GitLab 설치에서 사용하려면, GitLab 관리자가 활성화해야 합니다.

Kroki

Kroki를 GitLab에서 사용하려면, GitLab 관리자가 활성화해야 합니다. 자세한 내용은 Kroki 통합 페이지를 참조하세요.

이모지

GitLab에서 이 주제 보기.

가끔 :monkey: 이모지와 몇 개의 :star2:를 추가해 :speech_balloon: 에 살짝 어우러질 때가 있습니다. 그럴 때를 위해 선물이 있어요:

:zap: GitLab Flavored Markdown이 지원되는 곳이라면 어디서든 이모지를 사용할 수 있습니다. :v:

이모지를 사용하여 :bug:를 지적하거나 :speak_no_evil: 패치에 대해 경고할 수 있습니다. 그리고 누군가 귀찮은 :snail: 코드를 개선해주면, :birthday:를 보내주세요. 사람들은 이를 기뻐합니다.

처음이라면 :fearful: 마십시오. 이모지 :family:에 가입할 수 있습니다. 지원되는 코드 중 하나를 찾아보세요.

모든 지원되는 이모지 코드 목록은 이모지 치트 시트를 참조하세요. :thumbsup:

위의 단락은 다음과 같은 Markdown으로 작성됩니다:

가끔 :monkey: 이모지와 몇 개의 :star2:를 추가해 :speech_balloon: 에 살짝 어우러질 때가 있습니다. 그럴 때를 위해 선물이 있어요:

:zap: GitLab Flavored Markdown이 지원되는 곳이라면 어디서든 이모지를 사용할 수 있습니다. :v:

이모지를 사용하여 :bug:를 지적하거나 :speak_no_evil: 패치에 대해 경고할 수 있습니다. 그리고 누군가 귀찮은 :snail: 코드를 개선해주면, :birthday:를 보내주세요. 사람들은 이를 기뻐합니다.

처음이라면 :fearful: 마십시오. 이모지 :family:에 가입할 수 있습니다. 지원되는 코드 중 하나를 찾아보세요.

모든 지원되는 이모지 코드 목록은 [이모지 치트 시트](https://www.webfx.com/tools/emoji-cheat-sheet/)를 참조하세요. :thumbsup:

이모지와 귀하의 운영 체제

이전 이모지 예제에서는 하드코딩된 이미지를 사용합니다. GitLab에서 렌더링된 이모지는 사용하는 운영 체제 및 브라우저에 따라 다르게 보일 수 있습니다.

대부분의 이모지는 macOS, Windows, iOS, Android에서 네이티브로 지원되며 지원되지 않는 경우 이미지 기반 이모지로 대체됩니다.

Linux에서 Noto Color Emoji를 다운로드하여 완전한 네이티브 이모지 지원을 받을 수 있습니다. 많은 최신 Linux 배포판과 같이 Ubuntu 22.04에는 기본적으로 이 폰트가 설치되어 있습니다.

사용자 정의 이모지를 추가하는 방법에 대해 자세히 알아보려면 사용자 정의 이모지를 참조하세요.

프론트 매터

프론트 매터는 Markdown 문서의 시작 부분에 포함된 메타데이터로, 내용 앞에 위치합니다. 이 데이터는 Jekyll, Hugo와 같은 정적 사이트 생성기에서 사용할 수 있습니다.

GitLab에서 렌더링된 Markdown 파일을 보면 프론트 매터가 문서 상단의 상자에 그대로 표시됩니다. HTML 콘텐츠는 프론트 매터 뒤에 표시됩니다. 예를 보려면 GitLab 문서 파일의 소스 및 렌더링된 버전을 전환할 수 있습니다.

GitLab에서 프론트 매터는 Markdown 파일과 위키 페이지에서만 사용되며 다른 Markdown 형식이 지원되는 위치에는 사용할 수 없습니다. 문서의 맨 위에 있어야 하며 구분자 사이에 있어야 합니다.

다음 구분자가 지원됩니다:

  • YAML (---):

    ---
    title: About Front Matter
    example:
      language: yaml
    ---
    
  • TOML (+++):

    +++
    title = "About Front Matter"
    [example]
    language = "toml"
    +++
    
  • JSON (;;;):

    ;;;
    {
      "title": "About Front Matter"
      "example": {
        "language": "json"
      }
    }
    ;;;
    

기존 구분자 중 하나에 지정어를 추가하여 다른 언어를 지원할 수 있습니다. 예를 들어:

---php
$title = "About Front Matter";
$example = array(
  'language' => "php",
);
---

인라인 차이

GitLab에서 이 주제 보기.

인라인 차이 태그를 사용하면 {+ 추가 +} 또는 [- 삭제 -]를 표시할 수 있습니다.

래핑 태그는 중괄호({})나 대괄호([])를 사용할 수 있습니다:

- {+ 추가 1 +}
- [+ 추가 2 +]
- {- 삭제 3 -}
- [- 삭제 4 -]

GitLab 인터페이스에 의해 렌더링된 인라인 차이


그러나 래핑 태그를 혼합할 수는 없습니다:

- {+ 추가 +]
- [+ 추가 +}
- {- 삭제 -]
- [- 삭제 -]

차이 하이라이팅은 `인라인 코드`에서 작동하지 않습니다. 텍스트에 역따옴표( )가 포함된 경우 각 역따옴표를 백슬래시 \로 이스케이프해야 합니다:

- {+ 일반 텍스트 +}
- {+ `역따옴표`가 포함된 텍스트 +}
- {+ 이스케이프된 \`역따옴표\`가 포함된 텍스트 +}

GitLab 인터페이스에 의해 렌더링된 혼합 형식의 인라인 차이

수학

  • GitLab 15.4에서 도입된 LaTeX 호환 펜싱은 markdown_dollar_math라는 플래그로 시작되었습니다. 기본적으로 비활성화되어 있습니다. GitLab.com에서 활성화됩니다.
  • GitLab 15.8에서 일반적으로 사용 가능한 LaTeX 호환 펜싱이 됐습니다. markdown_dollar_math 기능 플래그가 제거되었습니다.

GitLab에서 이 주제 보기.

LaTeX 구문으로 작성된 수식은 KaTeX로 렌더링됩니다. KaTeX는 LaTeX의 일부만 지원합니다. 이 구문은 또한 Asciidoc 위키와 :stem: latexmath를 사용하는 파일에서도 작동합니다. 자세한 내용은 Asciidoctor 사용자 매뉴얼을 참조하세요.

악의적인 활동을 방지하기 위해 GitLab은 인라인 수학의 경우 처음 50개의 수식만 렌더링합니다. 렌더링 시간에 따라 수학 블록의 수도 제한됩니다. 제한을 초과하는 경우 GitLab은 초과하는 수학 수식을 텍스트로 렌더링합니다. 위키 및 저장소 파일은 이러한 제한이 없습니다.

역따옴표로 묶인 달러 기호($$)나 단일 달러 기호($...$) 사이에 작성된 수식은 텍스트와 함께 인라인으로 렌더링됩니다.

두 개의 달러 기호($$$$)로 또는 math로 선언된 코드 블록 사이에 작성된 수식은 별도의 줄에 렌더링됩니다:

이 수식은 인라인입니다: $`a^2+b^2=c^2`$.

이 수식은 별도의 줄에 `math`로 작성되었습니다:

```math
a^2+b^2=c^2
```

인라인 `$$`로 작성된 수식은 별도의 줄에 렌더링됩니다: $$a^2+b^2=c^2$$

`$$...$$` 블록으로 작성된 수식은 별도의 줄에 렌더링됩니다:

$$
a^2+b^2=c^2
$$

작업 목록

  • GitLab 15.3에서 소개된 적용 불가능한 확인란들입니다.

GitLab에서 이 항목 보기.

Markdown이 지원되는 곳이면 어디에서나 작업 목록을 추가할 수 있습니다.

  • 이슈, 병합 요청, 에픽, 댓글에서 상자를 선택할 수 있습니다.
  • 다른 모든 곳에서는 상자를 선택할 수 없습니다. 괄호 안에 x를 추가하거나 제거하여 Markdown을 수동으로 편집해야 합니다.

완료 및 미완료 외에도 작업은 적용 불가능할 수 있습니다. 이슈, 병합 요청, 에픽, 또는 댓글에서 적용 불가능한 확인란을 선택하면 아무런 영향이 없습니다.

작업 목록을 만들려면 정렬된 목록 또는 정렬되지 않은 목록 형식을 따르세요:

- [x] 완료된 작업
- [~] 적용 불가능한 작업
- [ ] 미완료된 작업
  - [x] 하위 작업 1
  - [~] 하위 작업 2
  - [ ] 하위 작업 3

1. [x] 완료된 작업
1. [~] 적용 불가능한 작업
1. [ ] 미완료된 작업
   1. [x] 하위 작업 1
   1. [~] 하위 작업 2
   1. [ ] 하위 작업 3

GitLab에서 렌더링된 작업 목록

테이블에 작업 목록을 포함하려면 HTML 목록 태그나 HTML 테이블을 사용하세요.

목차

목차는 문서의 소제목에 연결된 정렬되지 않은 목록입니다. 이슈, 병합 요청 및 에픽에 목차를 추가할 수 있지만 노트나 댓글에는 추가할 수 없습니다.

지원되는 내용 유형의 설명 필드에 다음 중 하나의 태그를 개별 행에 추가하세요:

[[_TOC_]]
또는
[TOC]
  • Markdown 파일.
  • 위키 페이지.
  • 이슈.
  • 병합 요청.
  • 에픽.

참고: 단일 대괄호로 TOC 코드를 사용해도 목차가 렌더링되며 이러한 동작은 의도된 것이 아닙니다. 자세한 정보는 issue 359077을 참조하십시오.

이 문장은 내 위키 페이지를 소개합니다.

[[_TOC_]]

## 내 첫 번째 제목

첫 번째 섹션 내용.

## 내 두 번째 제목

두 번째 섹션 내용.

위키에서 자동 생성된 목차 미리보기

위키별 Markdown

다음 항목에서는 위키 내 하이퍼링크의 작동 방식을 보여줍니다.

위키 페이지에 링크를 걸 때는 페이지 이름 대신 페이지 슬러그를 사용해야 합니다.

위키 - 직접 페이지 링크

직접 페이지 링크는 해당 페이지를 가리키는 페이지 슬러그를 포함합니다.

이 예제에서는 위키의 루트에 있는 documentation 페이지에 링크합니다:

[문서로 이동](documentation)

위키 - 직접 파일 링크

직접 파일 링크는 현재 페이지와 관련된 파일 확장자를 가리킵니다.

다음 예제가 <your_wiki>/documentation/related 페이지에 있다면, <your_wiki>/documentation/file.md에 연결:

[파일로 이동](file.md)

위키 - 계층적 링크

계층적 링크는 ./<페이지>, ../<페이지> 등을 사용하여 현재 위키 페이지를 기준으로 구성할 수 있습니다.

이 예제가 <your_wiki>/documentation/main 페이지에 있다면, <your_wiki>/documentation/related에 연결:

[관련 페이지로 이동](related)

이 예제가 <your_wiki>/documentation/related/content 페이지에 있다면, <your_wiki>/documentation/main에 연결:

[관련 페이지로 이동](../main)

이 예제가 <your_wiki>/documentation/main 페이지에 있다면, <your_wiki>/documentation/related.md에 연결::

[관련 페이지로 이동](related.md)

이 예제가 <your_wiki>/documentation/related/content 페이지에 있다면, <your_wiki>/documentation/main.md에 연결:

[관련 페이지로 이동](../main.md)

위키 - 루트 링크

루트 링크는 /로 시작하며 위키의 루트를 기준으로 상대적입니다.

이 예제는 <wiki_root>/documentation에 연결:

[관련 페이지로 이동](/documentation)

이 예제는 <wiki_root>/miscellaneous.md에 연결:

[관련 페이지로 이동](/miscellaneous.md)

diagrams.net 편집기

위키에서 diagrams.net 편집기를 사용하여 다이어그램을 만들 수 있습니다. 또한 diagrams.net 편집기로 만든 다이어그램을 편집할 수도 있습니다. 다이어그램 편집기는 일반 텍스트 편집기와 리치 텍스트 편집기에서 모두 사용할 수 있습니다.

자세한 정보는 Diagrams.net을 참조하세요.

일반 텍스트 편집기

일반 텍스트 편집기에서 다이어그램을 만들려면:

  1. 편집하려는 위키 페이지에서 편집을 선택합니다.
  2. 텍스트 상자에서 일반 텍스트 편집기를 사용하는지 확인합니다 (왼쪽 하단에 있는 버튼이 Rich text editing으로 전환이라고 표시됩니다).
  3. 편집기의 툴바에서 다이어그램 삽입 또는 편집 ()을 선택합니다.
  4. app.diagrams.net 편집기에서 다이어그램을 만듭니다.
  5. 저장하고 나가기를 선택합니다.

위키 컨텐츠에 다이어그램의 Markdown 이미지 참조가 삽입됩니다.

일반 텍스트 편집기에서 다이어그램을 편집하려면:

  1. 편집하려는 위키 페이지에서 편집을 선택합니다.
  2. 텍스트 상자에서 일반 텍스트 편집기를 사용하는지 확인합니다 (왼쪽 하단에 있는 버튼이 Rich text editing으로 전환이라고 표시됩니다).
  3. 다이어그램을 포함하는 Markdown 이미지 참조의 위치로 커서를 이동합니다.
  4. 다이어그램 삽입 또는 편집 ()을 선택합니다.
  5. app.diagrams.net 편집기에서 다이어그램을 편집합니다.
  6. 저장하고 나가기를 선택합니다.

이전 다이어그램을 대체하여 위키 컨텐츠에 다이어그램의 Markdown 이미지 참조가 삽입됩니다.

리치 텍스트 편집기

리치 텍스트 편집기에서 다이어그램을 만들려면:

  1. 편집하려는 위키 페이지에서 편집을 선택합니다.
  2. 텍스트 상자에서 리치 텍스트 편집기를 사용하는지 확인합니다 (왼쪽 하단에 있는 버튼이 일반 텍스트 편집으로 전환이라고 표시됩니다).
  3. 편집기의 툴바에서 추가 옵션 ()을 선택합니다.
  4. 드롭다운 목록에서 다이어그램 만들기 또는 편집을 선택합니다.
  5. app.diagrams.net 편집기에서 다이어그램을 만듭니다.
  6. 저장하고 나가기를 선택합니다.

diagrams.net 편집기에서 시각화된 다이어그램이 위키 컨텐츠에 삽입됩니다.

리치 텍스트 편집기에서 다이어그램을 편집하려면:

  1. 편집하려는 위키 페이지에서 편집을 선택합니다.
  2. 텍스트 상자에서 리치 텍스트 편집기를 사용하는지 확인합니다 (왼쪽 하단에 있는 버튼이 일반 텍스트 편집으로 전환이라고 표시됩니다).
  3. 편집하려는 다이어그램을 선택합니다.
  4. 부동 툴바에서 다이어그램 편집 ()을 선택합니다.
  5. app.diagrams.net 편집기에서 다이어그램을 편집합니다.
  6. 저장하고 나가기를 선택합니다.

선택한 다이어그램이 업데이트된 버전으로 대체됩니다.

GitLab 특정 참조

GitLab Flavored Markdown은 GitLab 특정 참조를 렌더링합니다. 예를 들어 이슈, 커밋, 팀 멤버 또는 전체 프로젝트 팀을 참조할 수 있습니다. GitLab Flavored Markdown은 해당 참조를 링크로 변환하여 이동할 수 있도록 합니다. 모든 프로젝트에 대한 참조는 프로젝트 이름이 아니라 프로젝트 슬러그를 사용해야 합니다.

또한, GitLab Flavored Markdown은 특정 교차 프로젝트 참조를 인식하고 동일 네임스페이스 내의 다른 프로젝트를 참조하는 약식 버전도 인식합니다.

GitLab Flavored Markdown은 다음을 인식합니다:

참조 입력 교차 프로젝트 참조 동일 네임스페이스 내의 약식 버전
특정 사용자 @user_name    
특정 그룹 @group_name    
전체 팀 @all    
프로젝트 namespace/project>    
이슈 #123 namespace/project#123 project#123
병합 요청 !123 namespace/project!123 project!123
스니펫 $123 namespace/project$123 project$123
Epic &123 group1/subgroup&123  
이터레이션 *iteration:"iteration title"    
이터레이션 주기 by ID1 [cadence:123]    
이터레이션 주기 by title (단어 하나)1 [cadence:plan]    
이터레이션 주기 by title (여러 단어)1 [cadence:"plan a"]    
취약점 [vulnerability:123] [vulnerability:namespace/project/123] [vulnerability:project/123]
기능 플래그 [feature_flag:123] [feature_flag:namespace/project/123] [feature_flag:project/123]
ID로 표시된 라벨 ~123 namespace/project~123 project~123
이름(단어 하나)로 표시된 라벨 ~bug namespace/project~bug project~bug
이름(여러 단어)로 표시된 라벨 ~"feature request" namespace/project~"feature request" project~"feature request"
스코프가 지정된 이름으로 표시된 라벨 ~"priority::high" namespace/project~"priority::high" project~"priority::high"
ID로 표시된 프로젝트 마일스톤 %123 namespace/project%123 project%123
이름(단어 하나)로 표시된 마일스톤 %v1.23 namespace/project%v1.23 project%v1.23
이름(여러 단어)로 표시된 마일스톤 %"release candidate" namespace/project%"release candidate" project%"release candidate"
특정 커밋 9ba12248 namespace/project@9ba12248 project@9ba12248
커밋 범위 비교 9ba12248...b19a04f5 namespace/project@9ba12248...b19a04f5 project@9ba12248...b19a04f5
저장소 파일 참조 [README](doc/README.md)    
저장소 파일 참조(특정 줄) [README](doc/README.md#L13)    
경고 ^alert#123 namespace/project^alert#123 project^alert#123
연락처 [contact:test@example.com]    

주석:

  1. GitLab 16.9에 도입되었습니다. 이터레이션 주기 참조는 항상 [cadence:<ID>] 형식을 따릅니다. 예를 들어, 참조된 이터레이션 주기의 ID가 1인 경우 텍스트 참조 [cadence:"plan"][cadence:1]로 렌더링됩니다.
  2. 마일스톤의 경우 /namespace/project 앞에 추가하여 정확한 마일스톤을 지정하고 가능한 모호성을 제거합니다.

예를들어, #123을 사용하여 이슈를 참조하면 출력물은 #123 텍스트와 함께 이슈 번호 123로 링크됩니다. 마찬가지로, 이슈 번호 123에 대한 링크는 표시된 텍스트인 #123로 인식되어 포맷팅됩니다. #123을 이슈에 링크하고 싶지 않으면 앞에 백슬래시를 추가하여 \#123으로 만듭니다.

또한, 일부 객체에 대한 링크도 인식되어 서식이 지정됩니다. 예를 들어:

  • 이슈의 코멘트: "https://gitlab.com/gitlab-org/gitlab/-/issues/1234#note_101075757", #1234 (comment 101075757)으로 렌더링됨
  • 이슈 디자인 탭: "https://gitlab.com/gitlab-org/gitlab/-/issues/1234/designs", #1234 (designs)로 렌더링됨
  • 개별 디자인에 대한 링크: "https://gitlab.com/gitlab-org/gitlab/-/issues/1234/designs/layout.png", #1234[layout.png]로 렌더링됨.

참조에서 이슈, 병합 요청 또는 에픽 제목 표시

  • GitLab 14.6에서 이슈, 병합 요청 및 에픽을 지원합니다.
  • GitLab 16.0에서 작업 항목을 지원합니다.

이슈, 작업 항목, 병합 요청 또는 에픽의 렌더링된 링크에 제목을 포함하려면:

  • 참조 끝에 플러스(+)를 추가합니다.

예를 들어, #123+와 같은 참조는 The issue title (#123)로 렌더링됩니다.

https://gitlab.com/gitlab-org/gitlab/-/issues/1234+와 같은 URL 참조도 확장됩니다.

참조에서 이슈, 작업 항목 또는 병합 요청 요약 표시

  • GitLab 15.10에서 이슈 및 병합 요청을 지원합니다.
  • GitLab 16.0에서 작업 항목을 지원합니다.

이슈, 작업 항목 또는 병합 요청의 렌더링된 링크에 확장된 요약을 포함하려면:

  • 참조 끝에 +s를 추가합니다.

요약은 참조 항목의 담당자, 마일스톤상태 정보를 포함합니다.

예를 들어, #123+s와 같은 참조는 The issue title (#123) • First Assignee, Second Assignee+ • v15.10 • Needs attention로 렌더링됩니다.

https://gitlab.com/gitlab-org/gitlab/-/issues/1234+s와 같은 URL 참조도 확장됩니다.

담당자, 마일스톤 또는 상태가 변경된 경우 렌더링된 참조를 업데이트하려면:

  • 코멘트 또는 설명을 편집하고 저장합니다.

이슈 420807은 이러한 참조가 새로 고침되는 방식을 개선하고 있습니다.

Observability 대시보드 삽입

GitLab Observability UI 대시보드 설명 및 코멘트를 삽입할 수 있습니다. 예를 들어, 에픽, 이슈 및 병합 요청에서 가능합니다.

Observability 대시보드 URL을 삽입하려면:

  1. GitLab Observability UI에서 주소 표시줄의 URL을 복사합니다.
  2. 링크를 코멘트나 설명에 붙여넣습니다. GitLab Flavored Markdown은 URL을 인식하고 소스를 표시합니다.

인용 블록

GitLab에서 이 주제 보기.

사이드 노트와 같은 정보를 강조하기 위해 인용 블록을 사용합니다. 인용 블록의 줄을 >로 시작하여 생성합니다.

> 인용 블록은 답글 텍스트를 모방하는 데 도움이 됩니다.
> 이 줄은 동일한 인용의 일부입니다.

인용 블록의 휴식.

> 이 매우 긴 줄도 올바르게 인용되어 줄바꿈됩니다. 이 줄은 실제로 모두에게 충분히 길게 보이도록 쓰는 것이 중요합니다. 또한 인용 블록에서 *Markdown*을 사용할 수 있습니다.

인용 블록은 답글 텍스트를 모방하는 데 도움이 됩니다. 이 줄은 동일한 인용의 일부입니다.

인용 블록의 휴식.

이 매우 긴 줄도 올바르게 인용되어 줄바꿈됩니다. 이 줄은 실제로 모두에게 충분히 길게 보이도록 쓰는 것이 중요합니다. 또한 인용 블록에서 Markdown을 사용할 수 있습니다.

여러 줄 인용 블록

GitLab에서 이 주제 보기.

>>>로 묶인 여러 줄의 인용 블록을 생성합니다.

>>>
다른 곳에서 가져온 여러 줄에 걸친 메시지를 붙여넣을 경우
수동으로 각 줄마다 `>`을 추가하지 않아도 인용할 수 있습니다!
>>>

다른 곳에서 가져온 여러 줄에 걸친 메시지를 붙여넣을 경우 수동으로 각 줄마다 >을 추가하지 않아도 인용할 수 있습니다!

코드 스팬 및 블록

GitLab에서 이 주제 보기.

일반 텍스트가 아닌 코드로 간주되어야 하는 항목을 강조합니다.

인라인 코드는 해당 내용을 역 따옴표 `로 포맷합니다:

인라인 `코드``back-ticks around`로 포맷됩니다.

인라인 코드back-ticks around로 포맷됩니다.


더 큰 코드 예제에 유사한 효과를 얻으려면 다음을 수행할 수 있습니다:

  • 전체 코드 블록을 세 개의 역 따옴표로 묶습니다 (```).
    • 여러 개의 역 따옴표를 사용할 수 있으며, 여는 부분과 닫는 부분의 역 따옴표 수가 동일한 경우에만 가능합니다. 코드 블록에제안 사항을 포함하거나 그 반대 경우, 여러 개의 역 따옴표를 사용할 수 있습니다.
  • 전체 코드 블록을 세 개의 물결표로 묶습니다 (~~~).
  • 4개 이상의 공백으로 들여씁니다.
```python
def function():
    #들여쓰기는 코드 블록에서 완벽하게 동작합니다.
    s = "Python 코드"
    print s
```

    4개의 공백을 사용하면
    3 역 따옴표 블록과 동일한 역할을 합니다.
~~~
물결표도 괜찮습니다.
~~~

위의 세 가지 예제는 다음과 같이 렌더링됩니다:

def function():
    #들여쓰기는 코드 블록에서 완벽하게 동작합니다.
    s = "Python 코드"
    print s
4개의 공백을 사용하면
3 역 따옴표 블록과 동일한 역할을 합니다.
물결표도 괜찮습니다.

컬러 코드 및 구문 강조

GitLab에서 이 주제 보기.

GitLab은 코드 블록에서 더 다채로운 구문 강조를 위해 Rouge Ruby 라이브러리를 사용합니다. 지원되는 언어 목록은 Rouge 프로젝트 위키에서 확인할 수 있습니다. 구문 강조는 코드 블록에서만 지원되므로 인라인 코드를 강조할 수 없습니다.

코드 블록을 표시하고 구문 강조를 적용하려면 코드 선언의 시작 부분에 코드 언어를 추가한 뒤, 세 개의 역따옴표 (```) 또는 세 개의 물결표 (~~~)를 사용합니다:

```javascript
var s = "JavaScript syntax highlighting";
alert(s);
def function():
    # 코드 블록 내에서 들여쓰기가 잘 동작합니다.
    s = "Python syntax highlighting"
    print s
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html
언어가 지정되지 않았으므로 구문 강조가 적용되지 않습니다.
s = "이 줄에는 강조 표시가 표시되지 않습니다."
하지만 <b>tag</b>을 넣어봅시다.

위의 네 가지 예제는 다음과 같이 렌더링됩니다:

```javascript
var s = "JavaScript syntax highlighting";
alert(s);
def function():
    # 코드 블록 내에서 들여쓰기가 잘 동작합니다.
    s = "Python syntax highlighting"
    print s
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html
언어가 지정되지 않았으므로 구문 강조가 적용되지 않습니다.
s = "이 줄에는 강조 표시가 표시되지 않습니다."
하지만 <b>tag</b>을 넣어봅시다.

강조

GitLab에서 이 주제 보기.

여러 가지 방법으로 텍스트에 강조를 줄 수 있습니다. 이탤릭체, 볼드체, 취소선을 사용하거나 이러한 강조 양식을 결합할 수 있습니다.

예제:

강조 표시, 또는 이탤릭체는 *별표* 또는 _언더바_를 사용합니다.

강조된 강한 표시, 또는 볼드체는 두 개의 **별표** 또는 __언더바__를 사용합니다.

별표와 _언더바_를 **결합한 강조 양식**입니다.

물결표 두 개로 취소선을 그을 수 있습니다. ~~이것을 지웁니다.~~

강조 표시, 또는 이탤릭체는 별표 또는 _언더바_를 사용합니다.

강조된 강한 표시, 또는 볼드체는 두 개의 별표 또는 __언더바__를 사용합니다.

별표와 _언더바_를 결합한 강조 양식입니다.

물결표 두 개로 취소선을 그을 수 있습니다. 이것을 지웁니다.

단어 내의 여러 언더스코어 및 단어 중간 강조

GitLab에서 이 주제 보기.

단어의 일부를 이탤릭체로 표시하는 것을 피하십시오, 특히 코드나 여러 개의 밑줄이 자주 나오는 이름과 관련된 경우입니다.

GitLab 제공 마크다운은 단어 내의 여러 밑줄을 무시하여 코드에 대한 더 나은 렌더링을 위해 다음과 같은 마크다운 문서에 대한 논의를 허용합니다:

perform_complicated_task

do_this_and_do_that_and_another_thing

but_emphasis is_desired _here_

perform_complicated_task

do_this_and_do_that_and_another_thing

but_emphasis is_desired here


원하는 경우 단어의 일부에 강조를 넣고 싶다면, 별표로 처리할 수 있습니다:

perform*complicated*task

do*this*and*do*that*and*another thing

performcomplicatedtask

dothisanddothatandanother thing

각주

GitLab에서 이 주제 보기.

각주는 마크다운 파일 끝에 렌더링된 노트에 링크를 추가합니다.

각주를 만들려면 참조 태그와 노트 내용이 포함된 별도의 줄이 필요합니다.

태그의 상대적인 순서에 관계없이, 참조 태그의 상대적인 순서가 렌더링된 번호를 결정합니다.

노트를 어디에 두든지 파일의 맨 아래에 항상 표시됩니다.

각주 참조 태그는 다음과 같이 표시됩니다: [^1]

이 참조 태그는 문자와 숫자의 조합입니다. [^footnote-42]

[^1]: 이 텍스트는 각주 안에 있습니다.

[^footnote-42]: 이 텍스트는 또 다른 각주입니다.

각주 참조 태그는 다음과 같이 표시됩니다:1

이 참조 태그는 문자와 숫자의 조합입니다.2

헤딩

#를 사용하여 1에서 6까지의 헤딩을 만듭니다.

# H1
## H2
### H3
#### H4
##### H5
###### H6

또는 H1 및 H2에 대해 밑줄 스타일을 사용할 수도 있습니다.

Alt-H1
======

Alt-H2
------

헤딩 ID 및 링크

GitLab에서이 주제보기.

모든 Markdown으로 렌더링된 헤딩은 주석을 제외하고 자동으로 링크 할 수있는 ID가 부여됩니다.

다음 규칙에 따라 헤딩의 내용에서 생성됩니다.

  1. 텍스트에서 모든 것은 소문자로 변환됩니다.
  2. 구두점이나 HTML과 같은 모든 비 단어 텍스트가 제거됩니다.
  3. 모든 공백은 하이픈으로 변환됩니다.
  4. 두 개 이상의 하이픈이 하나로 변환됩니다.
  5. 이미 생성 된 동일한 ID가있는 경우 고유 한 증가 번호가 추가됩니다. 1에서 시작하여 증가합니다.

예:

# This heading has spaces in it
## This heading has a :thumbsup: in it
# This heading has Unicode in it: 한글
## This heading has spaces in it
### This heading has spaces in it
## This heading has 3.5 in it (and parentheses)

다음과 같은 링크 ID가 생성됩니다. 1. this-heading-has-spaces-in-it 1. this-heading-has-a-in-it 1. this-heading-has-unicode-in-it-한글 1. this-heading-has-spaces-in-it-1 1. this-heading-has-spaces-in-it-2 1. this-heading-has-3-5-in-it-and-parentheses

이모지 처리는 헤딩 ID가 생성 된 후에 수행됩니다. 표시 상태 이미지로 변환되고 그런 다음 ID에서 제거됩니다.

가로줄

GitLab에 이 주제보기.

세 개 이상의 하이픈, 별표 또는 밑줄을 사용하여 수평 줄을 만들 수 있습니다.

---

***

___



이미지

인라인 또는 참조 링크를 사용하여 이미지를 포함시킵니다. 제목 텍스트를 보려면 이미지 위로 가리키세요.

인라인 스타일:

![대체 텍스트](img/markdown_logo.png "제목 텍스트")

대체 텍스트

참조 스타일:

![대체 텍스트1][로고]

&#91;로고]: img/markdown_logo.png "제목 텍스트"

대체 텍스트

이미지 또는 비디오 크기 변경

  • 이미지 지원 도입 : GitLab 15.7.
  • 비디오 지원 도입 : GitLab 15.9.

GitLab에서이 주제보기.

이미지 또는 비디오의 너비와 높이를 제어 할 수 있습니다. 이미지 뒤에 속성 목록을 추가함으로써 가능합니다. 값은 px (기본값) 또는 % 단위의 정수 여야합니다.

예를 들면

![alt text](img/markdown_logo.png "Title Text"){width=100 height=100px}

![alt text](img/markdown_logo.png "Title Text"){width=75%}

alt text{width=100 height=100px}

Markdown 대신 ‘img’ HTML 태그를 사용하여 ‘높이’ 및 ‘너비’ 매개 변수를 설정할 수도 있습니다.

비디오

GitLab에 이 주제보기.

비디오 확장자를 가진 파일에 연결된 이미지 태그는 자동으로 비디오 플레이어로 변환됩니다. 유효한 비디오 확장명은 .mp4, .m4v, .mov, .webm, .ogv입니다.

다음은 예시 비디오입니다.

![Sample Video](img/markdown_video.mp4)

Sample Video

오디오

GitLab에서 이 주제 보기.

동영상과 유사하게 오디오 확장자를 가진 파일에 대한 링크 태그는 자동으로 오디오 플레이어로 변환됩니다. 유효한 오디오 확장자는 .mp3, .oga, .ogg, .spx, .wav입니다.

다음은 오디오 클립의 예입니다:

![샘플 오디오](img/markdown_audio.mp3)

샘플 오디오

인라인 HTML

  • rel="license"를 허용한 것은 GitLab 14.6에 도입되었습니다.

GitLab에서 이 주제 보기.

Markdown에서 직접 HTML을 사용할 수 있으며, 일반적으로 잘 작동합니다.

HTML::PipelineSanitizationFilter 클래스의 문서에서 허용된 HTML 태그 및 속성 목록을 참조하세요. 기본 SanitizationFilter 허용 목록에 추가로 GitLab은 span, abbr, details, summary 요소를 허용합니다. rel="license"는 링크에서 Rel-License 마이크로포맷 및 라이선스 소유권 표기를 지원하기 위해 허용됩니다.

<dl>
  <dt>정의 목록</dt>
  <dd>가끔 사람들이 사용하는 것입니다.</dd>

  <dt>HTML에서의 Markdown</dt>
  <dd>대부분의 경우에는 *잘* 작동하지 않습니다. HTML <em>태그</em>는 대부분의 경우에는 <b>작동</b>합니다.</dd>
</dl>
정의 목록
가끔 사람들이 사용하는 것입니다.
HTML에서의 Markdown
대부분의 경우에는 *잘* 작동하지 않습니다. HTML 태그는 대부분의 경우에는 작동합니다.

아직도 HTML 태그 내에서 Markdown을 사용하는 것이 가능하지만, Markdown을 포함하는 줄은 각각의 개별적인 줄로 구분되어야 합니다.

<dl>
  <dt>HTML에서의 Markdown</dt>
  <dd>대부분의 경우에는 *잘* 작동하지 않습니다. HTML 태그는 대부분의 경우에는 *작동*합니다.</dd>

  <dt>올바른 간격을 가진 HTML 내의 Markdown</dt>
  <dd>

  *잘* 작동하지 않습니다. HTML 태그는 대부분의 경우에는 *작동*합니다.

  </dd>
</dl>
HTML에서의 Markdown
대부분의 경우에는 *잘* 작동하지 않습니다. HTML 태그는 대부분의 경우에는 *작동*합니다.
올바른 간격을 가진 HTML 내의 Markdown
작동하지 않습니다. HTML 태그는 대부분의 경우에는 작동합니다.

접기 가능한 섹션

GitLab에서 이 주제 보기.

HTML의 <details><summary> 태그를 사용하여 콘텐츠를 접을 수 있습니다. 예를 들어, 긴 로그 파일을 접어서 화면 공간을 적게 사용할 수 있습니다.

<details>
<summary>확장하려면 클릭</summary>

이러한 세부 사항은 확장할 때까지 <em>숨겨진</em> 상태를 유지합니다.

<pre><code>여기에 로그를 붙여넣으세요</code></pre>

</details>
확장하려면 클릭 이러한 세부 사항은 확장할 때까지 숨겨진 상태를 유지합니다.
여기에 로그를 붙여넣으세요

이러한 태그 내의 Markdown도 지원됩니다.

예시와 같이 Markdown 섹션 앞 뒤에 빈 줄을 남겨야 함을 기억해주세요:

<details>
<summary>

확장하려면 *클릭*하세요.

</summary>

이러한 세부 사항은 *숨겨진* 상태를 유지합니다.

```
여기에 로그를 붙여넣으세요
```

</details>
클릭하여 확장하세요. 이러한 세부 사항은 **숨겨진** 상태를 유지합니다.
여기에 로그를 붙여넣으세요

줄 바꿈

GitLab에서 이 주제 보기.

이전 텍스트가 두 번의 줄 바꿈으로 끝나면 (즉, 연속된 줄이 아닌 경우) 줄 바꿈이 삽입됩니다. 이전 문장에서 두 번의 Enter 키를 누르면 새로운 단락이 시작됩니다. 한 번의 줄 바꿈만 사용하면 (한 번에 Enter 키를 누름) 다음 문장은 여전히 같은 단락의 일부로 유지됩니다. 이 방법을 사용하면 긴 줄이 줄 바꿈되지 않고 편집 가능한 상태로 유지하고 싶다면:

여기에 시작할 우리를 위한 한 줄이 있습니다.

이 더 긴 줄은 위의 두 번의 줄 바꿈으로 분리되어 있으므로 *별도의 단락*입니다.

이 줄도 별도의 단락입니다만...
이들은 단일 줄 바꿈으로만 분리되어 있기 때문에
이들은 *줄 바꿈하지 않고* 이전 줄을 따르며
*같은 단락*에서 계속됩니다.

여기에 시작할 우리를 위한 한 줄이 있습니다.

이 더 긴 줄은 위의 두 번의 줄 바꿈으로 분리되어 있으므로 별도의 단락입니다.

이 줄도 별도의 단락입니다만… 이들은 단일 줄 바꿈으로만 분리되어 있기 때문에 이들은 줄 바꿈하지 않고 이전 줄을 따르며 같은 단락에서 계속됩니다.

줄 바꿈

GitLab Flavored Markdown은 단락 및 줄 바꿈에 대한 Markdown 사양을 준수합니다.

문단은 하나 이상의 연속된 텍스트 줄로 이루어져 있으며, 하나 이상의 공백 라인(첫 번째 문단의 끝에서 두 번의 줄 바꿈)으로 구분됩니다. (위에서 설명한 대로)

줄 바꿈이나 소프트 리턴에 대해 더 많은 제어가 필요한가요? 줄 끝에 백스래시로 줄 바꿈을 추가하거나 두 개 이상의 공백을 추가하여 단일 줄 바꿈을 추가하세요. 연속된 두 줄 바꿈은 새로운 단락을 만들며, 그 사이에는 빈 줄이 있습니다:

첫 번째 단락.
같은 단락의 다른 줄.
같은 단락의 세 번째 줄이지만, 이번에는 뒤에 두 개의 공백.<space><space>
첫 번째 단락 바로 아래에 새로운 줄.

두 번째 단락.
다른 줄, 이번에는 백슬래시로 끝냅니다.\
이전 백슬래시로 인해 새로운 줄입니다.

링크

GitLab에서 이 주제 보기.

링크는 인라인 스타일과 참조 스타일 두 가지 방식으로 생성할 수 있습니다. 예를 들어:

인라인 링크:

제목 ID 앵커 사용:

참조 사용:

  • 이 줄은 [참조 스타일 링크, 아래 참조 텍스트 참조하세요][임의 대소문자 구분 없는 참조 텍스트]를 보여줍니다.
  • 숫자를 사용하여 [참조 스타일 링크 정의에 대한 링크, 아래 참조 텍스트 참조하세요][1]를 보여줍니다.
  • 빈 상태로 두고 [링크 텍스트 자체를 사용, 아래 참조 텍스트 참조하세요][]를 보여줍니다.

참조 링크를 나중에 따라올 수 있다는 것을 보여주기 위한 일부 텍스트입니다.

참고: 상대적 링크를 사용하면 프로젝트 파일을 위키 페이지에서 참조하거나, 프로젝트 파일에서 위키 페이지를 참조할 수 없습니다. 이유는 위키가 항상 GitLab의 별도 Git 리포지토리에 있기 때문입니다. 예를 들어, [참조 스타일 링크](style)는 위키 Markdown 파일 내에서 링크가 있는 경우에만 wikis/style에 링크를 지정합니다.

URL 자동 링크

GitLab에서 이 주제 보기.

텍스트에 넣은 거의 모든 URL은 자동으로 링크됩니다.

- https://www.google.com
- https://www.google.com
- ftp://ftp.us.debian.org/debian/
- smb://foo/bar/baz
- irc://irc.freenode.net/
- http://localhost:3000

목록

GitLab에서 이 주제 보기.

순서가 있는 목록과 순서가 없는 목록을 생성할 수 있습니다.

순서가 있는 목록에서는 각 행의 시작에 시작할 번호를 추가하고, 이후에는 숫자가 무엇이든 상관없습니다. 순서가 있는 목록은 수직적인 순서에 따라 자동으로 번호가 매겨지므로, 동일한 목록의 모든 항목에 대해 동일한 1.을 반복하는 것이 일반적입니다. 번호 1.로 시작하지 않고 다른 숫자로 시작하면 해당 숫자를 첫 번째 숫자로 사용하고 그 다음부터 세어 올립니다.

예시:

1. First ordered list item
2. Another item
   - Unordered sub-list.
1. Actual numbers don't matter, just that it's a number
   1. Ordered sub-list
   1. Next ordered sub-list item
4. And another item.
  1. First ordered list item
  2. Another item
    • Unordered sub-list.
  3. Actual numbers don’t matter, just that it’s a number
    1. Ordered sub-list
    2. Next ordered sub-list item
  4. And another item.

순서가 없는 목록에서는 -, *, 혹은 +와 공백을 각 행의 시작에 추가합니다. 그러나 혼합해서 사용해서는 안 됩니다.

순서가 없는 목록은 다음과 같습니다:

- 사용
- 빼기

또한 다음과 같습니다:

- 사용
- 별표

또한 다음과 같습니다:

- 사용
- 더하기

순서가 없는 목록은 다음과 같습니다:

  • 사용
  • 빼기

또한 다음과 같습니다:

  • 사용
  • 별표

또한 다음과 같습니다:

  • 사용
  • 더하기

목록 항목에 여러 단락이 포함된 경우, 각 후속 단락은 목록 항목 텍스트의 시작과 동일한 수준으로 들여 써야 합니다.

예시:

1. First ordered list item

   첫 번째 항목의 두 번째 단락.

1. Another item
  1. First ordered list item

    첫 번째 항목의 두 번째 단락.

  2. Another item


첫 번째 항목의 단락이 올바른 수의 공백으로 들여 써져 있지 않으면 단락이 목록 항목의 외부에 나타나며, 목록 항목 텍스트 하단에 올바르게 들여쓰지 않습니다. 예를 들어:

1. First ordered list item

  첫 번째 항목의 단락.

1. Another item
  1. First ordered list item

첫 번째 항목의 단락.

  1. Another item

순서가 있는 목록이 순서가 없는 목록 항목의 첫 번째 서브 항목일 경우 1.로 시작하지 않는 경우 앞에 공백 줄을 넣어야 합니다.

좋음

- 순서가 없는 목록 항목

  5. 첫 번째 순서가 있는 목록 항목

나쁨

- 순서가 없는 목록 항목
  5. 첫 번째 순서가 있는 목록 항목

CommonMark는 순서가 있는 목록 항목과 순서가 없는 목록 항목 사이의 공백 줄을 무시하고 하나의 목록으로 간주합니다. 이는 loose 목록으로 렌더링됩니다. 각 목록 항목은 단락 태그로 둘러싸여 있으므로 단락 간격과 여백이 있습니다. 이로써 목록 항목 사이에 추가 간격이 있는 것처럼 보입니다.

예를 들어:

- 첫 번째 목록 항목
- 두 번째 목록 항목

- 다른 목록

CommonMark는 공백 줄을 무시하고 단락 간격이 있는 것처럼 이것을 하나의 목록으로 렌더링합니다.

Superscripts/Subscripts

GitLab에서 이 주제 보기.

Superscripts와 Subscripts를 사용하려면 표준 HTML 구문을 사용하세요.

물의 화학식은 H<sub>2</sub>O 입니다.
반면에 상대성이론의 방정식은 E = mc<sup>2</sup> 입니다.

물의 화학식은 H2O 입니다. 반면에 상대성이론의 방정식은 E = mc2 입니다.

GitLab Flavored Markdown은 Redcarpet 슈퍼스크립트 구문 ( x^2 )을 지원하지 않습니다.

키보드 HTML 태그

GitLab에서 이 주제 보기.

<kbd> 요소는 사용자 키보드 입력을 나타내는 텍스트를 식별하는 데 사용됩니다. <kbd> 태그로 둘러싸인 텍스트는 일반적으로 브라우저의 기본 고정폭 글꼴로 표시됩니다.

Press <kbd>Enter</kbd> to go to the next page.

Press Enter to go to the next page.

테이블

GitLab에서 이 주제 보기.

테이블을 만들 때:

  • 첫 번째 줄은 “파이프”(|)로 구분된 헤더를 포함합니다.
  • 두 번째 줄은 헤더를 셀과 분리합니다.
    • 셀에는 공백, 하이픈 및 (선택적으로) 수평 정렬을 위한 콜론만 포함될 수 있습니다.
    • 각 셀은 적어도 하나의 하이픈을 포함해야 하지만, 셀에 더 많은 하이픈을 추가해도 셀의 렌더링이 변경되지 않습니다.
    • 하이픈, 공백 또는 콜론 이외의 내용은 허용되지 않습니다.
  • 세 번째 줄 및 이후의 줄에는 셀 값이 포함됩니다.
    • Markdown에서 여러 줄에 걸쳐 셀을 분리할 수는 없지만, 한 줄에 유지해야 합니다. 필요한 경우 HTML <br> 태그를 사용하여 강제로 개행할 수 있습니다.
    • 셀 크기는 서로 일치시킬 필요가 없습니다. 유연하나 파이프(|)로 분리되어야 합니다.
    • 빈 셀을 포함할 수 있습니다.
  • 셀 너비는 셀 내용에 기반하여 동적으로 계산됩니다.
  • 텍스트 안에 표시 문자(|)를 사용하려면 백슬래시(\|)로 이스케이프 처리해야 합니다.

예시:

| header 1 | header 2 | header 3 |
| ---      | ---      | ---      |
| cell 1   | cell 2   | cell 3   |
| cell 4 | cell 5 is longer | cell 6 is much longer than the others, but that's ok. It eventually wraps the text when the cell is too large for the display size. |
| cell 7   |          | cell 9   |
header 1 header 2 header 3
cell 1 cell 2 cell 3
cell 4 cell 5 is longer cell 6 is much longer than the others, but that’s ok. It eventually wraps the text when the cell is too large for the display size.
cell 7   cell 9

정렬

GitLab에서 이 주제 보기.

또한, 두 번째 행의 “대시” 라인 양쪽에 콜론(:)을 추가하여 텍스트의 정렬을 선택할 수 있습니다. 이것은 각 열의 모든 셀에 영향을 줍니다:

| Left Aligned | Centered | Right Aligned |
| :---         | :---:    | ---:          |
| Cell 1       | Cell 2   | Cell 3        |
| Cell 4       | Cell 5   | Cell 6        |
Left Aligned Centered Right Aligned
Cell 1 Cell 2 Cell 3
Cell 4 Cell 5 Cell 6

GitLab 자체에서, Chrome과 Firefox에서 헤더는 항상 왼쪽으로 정렬되고, Safari에서는 가운데 정렬됩니다.

여러 줄을 포함하는 셀

GitLab에서 이 주제 보기.

테이블의 렌더링을 조정하기 위해 HTML 형식을 사용할 수 있습니다. 예를 들어, 셀이 여러 줄이 되도록 <br> 태그를 사용할 수 있습니다:

| Name | Details |
| ---  | ---     |
| Item1 | This text is on one line |
| Item2 | This item has:<br>- Multiple items<br>- That we want listed separately |
Name Details
Item1 This text is on one line
Item2 This item has:
- Multiple items
- That we want listed separately

테이블 내의 작업 목록

체크박스를 포함한 작업 목록을 추가하려면 HTML 형식을 사용하세요. 다음 중 하나를 사용할 수 있습니다:

  • 셀 내 Markdown을 사용한 HTML 테이블. 이 방식으로 서식이 지정된 테이블은 완전히 작동하는 작업 목록을 결과로 낳습니다.

    <table>
    <thead>
    <tr><th>header 1</th><th>header 2</th></tr>
    </thead>
    <tbody>
    <tr>
    <td>cell 1</td>
    <td>cell 2</td>
    </tr>
    <tr>
    <td>cell 3</td>
    <td>
    
    - [ ] Task one
    - [ ] Task two
    
    </td>
    </tr>
    </tbody>
    </table>
    
  • HTML 리스트 태그가 포함된 Markdown 테이블. 선택된 상태를 유지하지 않습니다. 이 방식으로 서식이 지정된 테이블은 docs.gitlab.com에서 올바르게 렌더링되지 않습니다.

    | header 1 | header 2 |
    | ---      | ---      |
    | cell 1   | cell 2   |
    | cell 3   | <ul><li> - [ ] Task one </li><li> - [ ] Task two </li></ul> |
    

또한 리치 텍스트 편집기에서 테이블 작성 및 작업 목록을 삽입할 수 있습니다.

스프레드시트에서 복사 및 붙여넣기

만일 당신이 스프레드시트 소프트웨어(예: Microsoft Excel, Google Sheets, 또는 Apple Numbers)에서 작업 중이라면, GitLab은 스프레드시트에서 복사하여 붙여넣을 때 Markdown 테이블을 생성합니다. 예를 들어, 다음과 같은 스프레드시트가 있다고 가정해보십시오:

스프레드시트에서 복사

셀을 선택하고 클립보드에 복사합니다. GitLab Markdown 항목을 열고 스프레드시트를 붙여넣습니다:

Markdown 테이블로 붙여넣기

JSON

History

JSON 코드 블록을 사용하여 테이블을 렌더링하려면 다음 구문을 사용하십시오:

```json:table
{}
```

이 기능의 비디오 워크스루를 확인하세요:

items 속성은 데이터 포인트를 나타내는 객체 목록입니다.

```json:table
{
    "items" : [
      {"a": "11", "b": "22", "c": "33"}
    ]
}
```

테이블 라벨을 지정하려면 fields 속성을 사용하십시오.

```json:table
{
    "fields" : ["a", "b", "c"],
    "items" : [
      {"a": "11", "b": "22", "c": "33"}
    ]
}
```

items의 모든 요소가 fields의 해당 값을 가질 필요는 없습니다.

```json:table
{
    "fields" : ["a", "b", "c"],
    "items" : [
      {"a": "11", "b": "22", "c": "33"},
      {"a": "211", "c": "233"}
    ]
}
```

fields가 명시적으로 지정되지 않은 경우, 라벨은 items의 첫 번째 요소에서 선택됩니다.

```json:table
{
    "items" : [
      {"a": "11", "b": "22", "c": "33"},
      {"a": "211", "c": "233"}
    ]
}
```

fields에 사용자 지정 라벨을 지정할 수 있습니다.

```json:table
{
    "fields" : [
        {"key": "a", "label": "AA"},
        {"key": "b", "label": "BB"},
        {"key": "c", "label": "CC"}
    ],
    "items" : [
      {"a": "11", "b": "22", "c": "33"},
      {"a": "211", "b": "222", "c": "233"}
    ]
}
```

fields의 개별 요소에 대해 정렬을 활성화할 수 있습니다.

```json:table
{
    "fields" : [
        {"key": "a", "label": "AA", "sortable": true},
        {"key": "b", "label": "BB"},
        {"key": "c", "label": "CC"}
    ],
    "items" : [
      {"a": "11", "b": "22", "c": "33"},
      {"a": "211", "b": "222", "c": "233"}
    ]
}
```

fields로 사용자 입력에 의해 동적으로 필터링된 내용을 가진 테이블을 렌더링하려면 filter 속성을 사용하십시오.

```json:table
{
    "fields" : [
        {"key": "a", "label": "AA"},
        {"key": "b", "label": "BB"},
        {"key": "c", "label": "CC"}
    ],
    "items" : [
      {"a": "11", "b": "22", "c": "33"},
      {"a": "211", "b": "222", "c": "233"}
    ],
    "filter" : true
}
```

기본적으로 각 JSON 테이블에는 Generated with JSON data 캡션이 있습니다. 이 캡션은 caption 속성을 지정하여 재정의할 수 있습니다.

```json:table
{
    "items" : [
      {"a": "11", "b": "22", "c": "33"}
    ],
    "caption" : "사용자 정의 캡션"
}
```

JSON이 잘못된 경우 오류가 발생합니다.

```json:table
{
    "items" : [
      {"a": "11", "b": "22", "c": "33"}
    ],
}

참고 자료

  1. 이 텍스트는 각주 안에 있습니다. 

  2. 이 텍스트는 또 다른 각주입니다.