多应用+插件架构,代码干净,二开方便,首家独创一键云编译技术,文档视频完善,免费商用码云13.8K 广告
## Card 卡片 基础容器,用来显示文字、列表、图文等内容,也可以配合其它组件一起使用。 ![](https://img.kancloud.cn/66/cd/66cd150fa288c4d7d8f8d3748f4a1b37_1905x263.png) ### 代码示例 基础用法 ```html <cvu-card> <div slot="header"> 卡片头部 </div> <div slot="content"> 卡片内容 </div> <div slot="footer"> 卡片底部 </div> </cvu-card> ``` 无边框 >[info] 设置`border`为`false` ![](https://img.kancloud.cn/f7/60/f76054f9044023b1932433dadc68705e_1912x265.png) ```html <cvu-card :border="false"> <div slot="header"> 卡片头部 </div> <div slot="content"> 卡片内容 </div> <div slot="footer"> 卡片底部 </div> </cvu-card> ``` ### props | 属性 | 说明 | 类型 | 默认值 | | --- | --- | --- | --- | | border | 是否显示边框 | Boolean | true | | padding | 卡片内边距 | String | \- | | hover | 鼠标悬停是否展示阴影效果 | Boolean | true | | divider | 是否显示header \| footer分割线 | Boolean | true | | divider-margin | 分割线外边距,divider参数为true时生效 | String | \- | ### slot | 名称 | 说明 | | --- | --- | | header | 卡片头部 | | content | 卡片内容 | | footer | 卡片底部 |