단계

번호가 매겨진 작업 목록에 스타일을 지정하여 단계별 가이드를 만들려면 <Steps> 컴포넌트를 사용하세요.

미리보기

1. 새 Starlight 프로젝트를 만듭니다:

   npm

   npm create astro@latest -- --template starlight

   pnpm

   pnpm create astro --template starlight

   Yarn

   yarn create astro --template starlight

2. 첫 번째 문서 페이지를 작성합니다.

가져오기

import { Steps } from '@astrojs/starlight/components';

사용

<Steps> 컴포넌트를 사용하여 번호가 매겨진 작업 목록의 스타일을 지정합니다. 이는 각 단계를 명확하게 강조해야 하는 보다 복잡한 단계별 가이드에 유용합니다.

표준 Markdown 정렬 목록을 <Steps>로 묶습니다. 모든 일반적인 Markdown 구문은 <Steps> 내에서 적용 가능합니다.

MDX

import { Steps } from '@astrojs/starlight/components';

<Steps>

1. 컴포넌트를 MDX 파일로 가져옵니다.

   ```js
   import { Steps } from '@astrojs/starlight/components';
   ```

2. 순서가 매겨진 목록 항목을 `<Steps>`로 묶습니다.

</Steps>

Markdoc

{% steps %}

1. 컴포넌트를 MDX 파일로 가져옵니다.

   ```js
   import { Steps } from '@astrojs/starlight/components';
   ```

2. 순서가 매겨진 목록 항목을 `<Steps>`로 묶습니다.

{% /steps %}

미리보기

1. 컴포넌트를 MDX 파일로 가져옵니다.

   import { Steps } from '@astrojs/starlight/components';

2. 순서가 매겨진 목록 항목을 <Steps>로 묶습니다.

<Steps> 속성

구현: Steps.astro

<Steps> 컴포넌트는 어떤 속성도 허용하지 않습니다.