Skip to content

Card 卡片

最基础的卡片容器,可承载文字、列表、图片、段落,常用于后台概览页面。

基础用法

this is header
this is card content.
点击查看源代码
vue
<template>
  <ik-card>
    <template #header>this is header</template>
    this is card content.
  </ik-card>
</template>

简单用法

this is card content.
点击查看源代码
vue
<template>
  <ik-card> this is card content. </ik-card>
</template>

阴影配置

始终展示
hover展示
无阴影
点击查看源代码
vue
<template>
  <ik-space>
    <ik-card> 始终展示 </ik-card>
    <ik-card shadow="hover"> hover展示 </ik-card>
    <ik-card shadow="none"> 无阴影 </ik-card>
  </ik-space>
</template>

3D 悬浮效果

content...

MIT Licensed