SuperAPI AI 工具集

el-card

通用与其它

查看项目

更新于 10-15 23:32

技能介绍

用途:el-card 是 Element Plus 的卡片组件,用于把信息整合进一个卡片容器,页眉和页脚可选。当用户需要展示分组内容、仪表盘卡片或内容区块时调用。

主要能力:支持 header、footer 属性设置标题与页脚;body-style 自定义卡片主体 CSS;header-class、body-class、footer-class 自定义各部分类名;shadow 控制阴影显示时机,取值为 always、never、hover,默认 always。提供 default、header、footer 三个插槽,可自定义默认内容、页眉内容与页脚内容。

使用方式:基础用法在 template 中使用 el-card,并通过 #header 插槽放置标题与操作按钮;简单卡片可省略页眉;带图片时可将 body-style 设为 padding: '0px' 并放入 img;阴影示例分别使用 shadow="always"、shadow="hover"、shadow="never"。仪表盘卡片可结合 el-statistic 展示数值。

适用场景:仪表盘卡片、内容区块、商品展示、信息分组。

最佳实践:交互式卡片使用 shadow="hover";需要自定义内边距时设置 body-style;结构化内容使用 header 和 footer 插槽。

限制:资料未提供安装命令、版本要求、收费与平台信息,暂未提供。