将信息分类后分标题、详情等区域聚合展现，一般作为简洁介绍或者信息的大盘和入口。
基本使用
常规的内容容器，可承载文字、列表、图片、段落，常用于模块划分和内容概览。
html
<iui-card title="Title" extra="More">
<view>This is content</view>
<view>This is content</view>
<view>This is content</view>
</iui-card><iui-card title="Title" extra="More">
<view>This is content</view>
<view>This is content</view>
<view>This is content</view>
</iui-card>阴影
指定 shadow 属性可以显示阴影。
html
<iui-card title="Title" extra="More" :shadow="true">
<view>This is content</view>
<view>This is content</view>
<view>This is content</view>
</iui-card><iui-card title="Title" extra="More" :shadow="true">
<view>This is content</view>
<view>This is content</view>
<view>This is content</view>
</iui-card>无边框
将 border 属性设置为 false 可以隐藏边框。
html
<iui-card title="Title" extra="More" :border="false">
<view>This is content</view>
<view>This is content</view>
<view>This is content</view>
</iui-card><iui-card title="Title" extra="More" :border="false">
<view>This is content</view>
<view>This is content</view>
<view>This is content</view>
</iui-card>仅显示内容
如果只需要内容区域，可以省略 title 属性 。
html
<iui-card>
<view>This is content</view>
<view>This is content</view>
</iui-card><iui-card>
<view>This is content</view>
<view>This is content</view>
</iui-card>更灵活的内容
通过 cover 插槽可以设置封面图，footer 插槽可以设置底部内容。
html
<iui-card title="Title" extra="More" :headerStyle="{ border: 'none' }">
<template #cover>
<view style="overflow: hidden">
<image
mode="aspectFill"
:src="url"
style="width: 100%; height: 200px"
></image>
</view>
</template>
<view>This is content</view>
<view>This is content</view>
<view>This is content</view>
<template #footer>
<view>This is footer</view>
</template>
</iui-card><iui-card title="Title" extra="More" :headerStyle="{ border: 'none' }">
<template #cover>
<view style="overflow: hidden">
<image
mode="aspectFill"
:src="url"
style="width: 100%; height: 200px"
></image>
</view>
</template>
<view>This is content</view>
<view>This is content</view>
<view>This is content</view>
<template #footer>
<view>This is footer</view>
</template>
</iui-card>API
<Card>props<Card>slots