步骤

要设置任务编号列表的样式以创建分步指南，请使用 <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> 组件来设置任务编号列表的样式。 这对于需要清楚地显示出有关每个步骤的、更复杂的分步指南来说，非常有用。

用 <Steps> 将标准的 Markdown 有序列表包裹起来。 所有常用的 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> 组件不接受任何 props。