콜아웃을 사용하여 노트의 흐름을 중단하지 않고 추가 콘텐츠를 포함하는 방법을 알아보세요. 콜아웃을 만들려면 _유형 식별자_인 `[!info]`를 블록 인용문의 첫 줄에 추가하십시오. 유형 식별자는 콜아웃이 어떻게 보이고 느낄지를 결정합니다. 모든 사용 가능한 유형을 보려면 [[#Supported types|지원되는 유형]]을 참조하십시오. ```markdown > [!info] > 여기에 콜아웃 블록이 있습니다. > 이것은 **마크다운**, [[Internal links|Wikilinks]], 그리고 [[Embedding files|임베드]]를 지원합니다! > ![[og-image.png]] ``` > [!info] > 여기에 콜아웃 블록이 있습니다. > It supports **Markdown**, [[내부 링크|Wikilinks]] and [[파일 삽입|임베드]]! > ![[og-image.png]] 콜아웃은 [[Obsidian Publish 소개|Obsidian Publish]]에서도 네이티브로 지원됩니다. > [!note] > Admonitions 플러그인을 사용 중인 경우 새 콜아웃 기능과 관련된 문제를 피하려면 적어도 버전 8.0.0으로 업데이트해야 합니다. ### Change the title 기본적으로 콜아웃의 제목은 타이틀 케이스의 유형 식별자입니다. 제목을 바꾸려면 유형 식별자 뒤에 텍스트를 추가하십시오: ```markdown > [!tip] 콜아웃에 사용자 정의 제목을 추가할 수 있습니다. > 이런 식으로요. ``` > [!tip] 콜아웃에 사용자 정의 제목을 추가할 수 있습니다. > 이런 식으로요. 제목만 있는 콜아웃을 만들려면 본문을 생략할 수도 있습니다: ```markdown > [!tip] 제목만 있는 콜아웃 ``` > [!tip] 제목만 있는 콜아웃 ### Foldable callouts 유형 식별자 바로 뒤에 플러스 (+) 또는 마이너스 (-)를 추가하여 콜아웃을 접을 수 있습니다. 플러스 기호는 기본적으로 콜아웃을 확장하고, 마이너스 기호는 대신에 콜아웃을 축소합니다. ```markdown > [!faq]- 콜아웃을 접을 수 있나요? > 네! 접힌 콜아웃에서는 콜아웃이 축소될 때 내용이 숨겨집니다. ``` > [!faq]- 콜아웃을 접을 수 있나요? > 네! 접힌 콜아웃에서는 콜아웃이 축소될 때 내용이 숨겨집니다. ### Nested callouts 여러 수준으로 콜아웃을 중첩시킬 수 있습니다. ```markdown > [!question] 콜아웃을 중첩시킬 수 있나요? > > [!todo] 네, 가능합니다. > > > [!example] 중첩된 수준을 사용할 수도 있습니다. ``` > [!question] 콜아웃을 중첩시킬 수 있나요? > > [!todo] 네, 가능합니다. > > > [!example] 중첩된 수준을 사용할 수도 있습니다. ### Customize callouts [[CSS 스니펫|CSS 스니펫]]과 [[커뮤니티 플러그인|커뮤니티 플러그인]]은 사용자 정의 콜아웃을 정의하거나 기본 구성을 덮어쓸 수 있습니다. 사용자 정의 콜아웃을 정의하려면 다음과 같은 CSS 블록을 만듭니다: ```css .callout[data-callout="custom-question-type"] { --callout-color: 0, 0, 0; --callout-icon: lucide-alert-circle; } ``` `data-callout` 속성 값은 사용할 유형 식별자입니다. 예를 들어 `[!custom-question-type]`와 같이 사용할 수 있습니다. - `--callout-color`는 빨간색, 녹색 및 파란색에 대한 숫자 (0–255)를 사용하여 배경색을 정의합니다. - `--callout-icon`은 [lucide.dev](https://lucide.dev/)의 아이콘 ID 또는 SVG 요소가 될 수 있습니다. > [!warning] Lucide 아이콘 버전에 대한 참고 사항 > Obsidian은 정기적으로 Lucide 아이콘을 업데이트합니다. 현재 포함된 버전은 아래에 표시됩니다. 사용자 정의 콜아웃에서는 이러한 아이콘이나 해당 버전 이전의 아이콘을 사용하십시오. > ![[크레디트#^lucide]] > [!tip] SVG 아이콘 > Lucide 아이콘 대신 콜아웃 아이콘으로 SVG 요소를 사용할 수도 있습니다. > > ```css > --callout-icon: '<svg>...custom svg...</svg>'; > ``` ### Supported types 여러 콜아웃 유형과 별칭을 사용할 수 있습니다. 각 유형은 다른 배경색과 아이콘을 가지고 있습니다. 이러한 기본 스타일을 사용하려면 예제에서 `info`를 다른 유형으로 바꾸어 `[!tip]` 또는 `[!warning]`과 같이 사용하십시오. [[#Customize callouts|콜아웃 사용자 정의]]를 사용하지 않는 한 지원되지 않는 유형은 모두 `note` 유형으로 기본 설정됩니다. 유형 식별자는 대소문자를 구분하지 않습니다. > [!note] > ```md > > [!note] > > Lorem ipsum dolor sit amet > ``` --- > [!abstract] > ```md > > [!abstract] > > Lorem ipsum dolor sit amet > ``` 별칭(Aliases): `summary`, `tldr` --- > [!info]- > ```md > > [!info] > > Lorem ipsum dolor sit amet > ``` --- > [!todo]- > ```md > > [!todo] > > Lorem ipsum dolor sit amet > ``` --- > [!tip]- > ```md > > [!tip] > > Lorem ipsum dolor sit amet > ``` 별칭(Aliases): `hint`, `important` --- > [!success]- > ```md > > [!success] > > Lorem ipsum dolor sit amet > ``` 별칭(Aliases): `check`, `done` --- > [!question]- > ```md > > [!question] > > Lorem ipsum dolor sit amet > ``` 별칭(Aliases): `help`, `faq` --- > [!warning]- > ```md > > [!warning] > > Lorem ipsum dolor sit amet > ``` 별칭(Aliases): `caution`, `attention` --- > [!failure]- > ```md > > [!failure] > > Lorem ipsum dolor sit amet > ``` 별칭(Aliases): `fail`, `missing` --- > [!danger]- > ```md > > [!danger] > > Lorem ipsum dolor sit amet > ``` 별칭(Aliases): `error` --- > [!bug]- > ```md > > [!bug] > > Lorem ipsum dolor sit amet > ``` --- > [!example]- > ```md > > [!example] > > Lorem ipsum dolor sit amet > ``` --- > [!quote]- > ```md > > [!quote] > > Lorem ipsum dolor sit amet > ``` 별칭(Aliases): `cite`