---
url: /components/container.md
---
# Container 容器

`EvContainer` 是官网栅格的基座：居中限宽 + 两侧留白。组件化的意义在于宽度档可以语义化选择，
并受 `--ev-container-width` 令牌约束 —— 通过 [EvConfigProvider](./config-provider) 可以整站调整容器宽度。

## 基础用法

```vue
<EvContainer width="narrow">
  <FaqSection />
</EvContainer>
```

::: tip 组件内置容器
[EvHero](./hero)、[EvFooter](./footer)、[EvNavbar](./navbar)、[EvCta](./cta) 内部已内置容器，
无需再包一层；[EvSection](./section) 可直接声明 `width` 档；`EvContainer` 用于其余自定义区块的外层对齐。
:::

## API

### Props

| 属性 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| width | 宽度档 | `'narrow' \| 'default' \| 'wide' \| 'full'` | `'default'` |
| as | 渲染标签 | string | `'div'` |

### 插槽

| 插槽 | 说明 |
| --- | --- |
| default | 容器内容 |