这篇文章主要介绍了Element Card 卡片的具体使用,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
组件― 卡片
基础用法
{{'列表内容 ' + o }} .text { font-size: 14px; } .item { margin-bottom: 18px; } .clearfix:before, .clearfix:after { display: table; content: ""; } .clearfix:after { clear: both } .box-card { width: 480px; }
简单卡片
{{'列表内容 ' + o }} .text { font-size: 14px; } .item { padding: 18px 0; } .box-card { width: 480px; }
带图片
0 ? 2 : 0"> ![在这里插入图片描述](https://imgconvert.csdnimg.cn/aHR0cHM6Ly9zaGFkb3cuZWxlbWVjZG4uY29tL2FwcC9lbGVtZW50L2hhbWJ1cmdlci45Y2Y3YjA5MS01NWU5LTExZTktYTk3Ni03ZjRkMGIwN2VlZjYucG5n) 好吃的汉堡 .time { font-size: 13px; color: #999; } .bottom { margin-top: 13px; line-height: 12px; } .button { padding: 0; float: right; } .image { width: 100%; display: block; } .clearfix:before, .clearfix:after { display: table; content: ""; } .clearfix:after { clear: both }
卡片阴影
总是显示 鼠标悬浮时显示 从不显示
Attributes:
参数 | 类型 | 说明 | 可选值 | 默认值 |
---|---|---|---|---|
header | 设置 header,也可以通过 slot#header 传入 DOM | string | ― | ― |
body-style | 设置 body 的样式 | object | ― | { padding: ‘20px' } |
到此这篇关于Element Card 卡片的具体使用的文章就介绍到这了,更多相关Element Card 卡片内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站!
以上就是Element Card 卡片的具体使用的详细内容,更多请关注本站其它相关文章!