# Card 卡片
# Card 概述
基础容器,用来显示文字、列表、图文等内容,也可以配合其它组件一起使用。
# Card 代码演示
# 基本用法
自定义标题、额外操作和主体内容,可以完全自由控制各个部分,也可以结合其它组件一起使用,较为灵活。
# 无边框
通过设置属性bordered
为 false ,可以不添加边框,建议在灰色背景下使用。
# 禁用悬停阴影
通过设置属性dis-hover
来禁用鼠标悬停显示阴影的效果。
# 卡片阴影
通过设置属性shadow
来显示卡片阴影,使用该属性后,bordered
和dis-hover
将无效,建议在灰色背景下使用。
# 简洁卡片
只包含内容区域,没有标题。
# Card API
# Card props
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
bordered | 是否显示边框,建议在灰色背景下使用 | Boolean | true |
dis-hover | 禁用鼠标悬停显示阴影 | Boolean | false |
shadow | 卡片阴影,建议在灰色背景下使用 | Boolean | false |
padding | 卡片内部间距,单位 px | Number | 16 |
# Card slot
名称 | 说明 |
---|---|
title | 自定义卡片标题,如果是简单文字,可以使用<p> 标签包裹 |
extra | 额外显示的内容,默认位置在右上角 |
无 | 卡片主体内容 |