---
url: /components/card.md
---
# Card 卡片

信息聚合的卡片容器：头部（`header` 插槽或 `header` 属性）、内容区与底部插槽，悬浮时边框微深并浮现投影，适合仪表盘、列表、详情等信息块。内容区默认内边距由 `--eb-card-padding` 变量控制，可用 `body-style` 覆盖。

## 基础用法

`header` 属性提供标题文字，默认插槽放内容，`#footer` 插槽渲染底部操作区（有内容时才渲染底部区域）。

## 阴影

`shadow` 默认 never；always 常驻投影，hover 悬停时显示，均为可见的层级投影（非描边）。默认所有卡片悬浮时边框微深并显示投影，传 `:hoverable="false"` 可完全关闭悬浮反馈（如纯信息展示的静态卡片墙）。

## 头部插槽

`#header` 插槽覆盖 `header` 属性，可放标题加操作按钮、状态标签等复合内容。

## 自定义内容区样式

`body-style` 同时接受对象与字符串两种写法，常用于调整内边距、背景色，实现信息密集或强调型卡片。

## 组合场景：卡片网格

与 Row / Col 组合出等距卡片列表，footer 放操作按钮，是后台仪表盘的典型排版。

## 磨砂玻璃

## API