Menu

Card
卡以类似于扑克牌的方式显示站点内容

下载

Types

Card

一个卡.

为了确保卡片的高度相等,请使用复数, cards. 卡片组自动使用 flex 样式以匹配同一行牌之间的高度.
Kristy
2013年加入
克里斯蒂是一位住在纽约的艺术指导.
14h
Elliot
17岁的喜欢 3评论

Cards

一组卡片.

卡片的设计是灵活的,以您的内容. content 块可以包含与内容相关的任何自定义元素.

艾略特福
的朋友Veronika
艾略特请求查看你的365客户端官网入口
Approve
Decline
珍妮赫斯
新成员
珍妮想把你加入小组 最好的朋友
Approve
Decline

内容

内容块

卡片可以包含内容块

项目时间表

活动

艾略特福 added 珍妮赫斯 到项目
特洛伊的海伦 添加两张图片

Image

卡片可以包含图像

卡可以用 reveal or 调光器 方便显示额外的内容,或选项悬停
团队傅 & Hess
创建于2014年9月
$('.特殊的.cards .image').调光器({ :“徘徊” });
添加朋友
团队傅
创建于2014年9月
添加朋友
团队赫斯
创建于2014年8月

Header

卡片可以包含标题

艾略特福
Friend
艾略特福是一位来自纽约的电影制作人.
Veronika东德
Friend
Veronika东德是一位住在纽约的布景设计师,她喜欢小猫、音乐和派对.
珍妮赫斯
Friend
珍妮是新学院媒体管理专业的学生

元数据

卡片可以包含内容元数据

您可以使用自己的类约定包含任意数量的元数据, 所有子元素将自动被分隔
可爱的狗
2天前 Animals

Link

卡片可以包含图像、标题或内部内容等链接

要制作完整内容的卡片链接,请查看下面的链接变体

Buttons

卡片可以包含按钮

艾略特福
艾略特福是一位来自纽约的电影制作人.
添加朋友
Veronika东德
Veronika东德是一位住在纽约的布景设计师,她喜欢小猫、音乐和派对.
添加朋友
珍妮赫斯
珍妮是新学院媒体管理专业的学生
添加朋友

批准

一张牌可以包含类似动作或星形动作.

可爱的狗
最喜欢的

描述

卡片可以包含一个或多个段落的描述

可爱的狗
2天前

可爱的狗有各种各样的形状和大小. 一些可爱的狗因为他们可爱的脸而可爱, 另一些则是因为身材矮小, 甚至还有其他体型庞大的动物.

许多人也有自己的衡量狗狗可爱的标准.

额外的内容

卡片可以包含额外的内容,这意味着要与主要内容分开进行格式化

可爱的狗
2天前

可爱的狗有各种各样的形状和大小. 一些可爱的狗因为他们可爱的脸而可爱, 另一些则是因为身材矮小, 甚至还有其他体型庞大的动物.

许多人也有自己的衡量狗狗可爱的标准.

121票

变化

液体卡

流体卡占用其容器的宽度

为中心的卡片

卡片可以把自己放在它的容器中

提高了卡

卡片可以被格式化成抬高到页面上方.

可爱的狗
Animals
Matt

联系卡片

卡片可以被格式化,这样整个内容就可以链接到另一个页面

可爱的狗
Animals
Matt

提出的内容

任何内容元素都可以向左或向右浮动

您可以使用自己的类约定包含任意数量的元数据, 所有子元素将自动被分隔
可爱的狗
2天前 Animals
Matt

文本对齐方式

卡片内的任何元素都可以指定其文本对齐方式

您可以使用自己的类约定包含任意数量的元数据, 所有子元素将自动被分隔
珍妮赫斯

珍妮是新学院媒体管理专业的学生

Jenny

彩色的

卡片可以指定一种颜色

列数

一组卡片可以设置一行中应该有多少张卡片

Rating:
Rating:
Rating:
Rating:
Rating:
Rating:
Rating:
Rating:

可叠起堆放的

一组卡片可以自动将行堆叠到移动设备上的单个列中

将浏览器调整到较小的大小,以查看到达移动断点后的卡片堆栈

翻倍

一组卡片可以将其列宽增加一倍

将浏览器调整到较小的大小,以查看到达移动断点后的卡片堆栈

调光器的信息
调光器分联箱

友情链接: 1 2 3 4 5 6 7 8 9 10