菜单

步骤
步骤用来显示一系列连续的活动。

下载

类型

标准 (Step)

标准步骤

航运

标准 (Steps)

标准步骤组

响应式控件

步骤控件在移动设备中将自动调整布局。 使用 tablet stackable 来设置成自动堆叠效果。

运输
选择您的运输方式
账单
输入帐单信息
确认订单

顺序 (Ordered)

顺序步骤可以显示有序的操作流程

运输
选择您的运输方式
账单
输入帐单信息
确认订单
确认账单细节

垂直 (Vertical)

步骤可以垂直的显示

运输
选择您的运输方式
账单
输入帐单信息
确认订单
确认订单详细信息

内容

描述 (Description)

步骤可以包含描述信息

运输
选择您的运输方式

图标 (Icon)

步骤可以包含图标

运输
选择您的运输方式

状态

激活 (Active)

步骤被激活时可以显示高亮的状态

账单
输入帐单信息

完成 (Completed)

步骤可设置为完成的状态

账单
输入帐单信息
账单
输入帐单信息

禁用 (Disabled)

步骤可设置为不能被选择的禁用状态

账单

变形

堆叠 (Stackable)

堆叠只在小屏幕中使用

运输
选择您的运输方式
账单
输入帐单信息
确认订单
确认订单详细信息

占满 (Fluid)

步骤可以占满整个容器

运输
选择您的运输方式
账单
输入帐单信息

这一步占用整个宽度

附属 (Attached)

步骤可以附属到其他元素上

运输
选择您的运输方式
账单
输入帐单信息
确认订单
确认订单详细信息
运输
选择您的运输方式
账单
输入帐单信息
确认订单
确认订单详细信息

均分 (Evenly Divided)

步骤可以在容器中均分大小

运输
账单
确认订单
账单
确认订单

尺寸 (Size)

步骤可设置为不同的尺寸

运输
选择您的运输方式
账单
输入帐单信息
确认订单
确认订单详细信息
运输
选择您的运输方式
账单
输入帐单信息
确认订单
确认订单详细信息
运输
选择您的运输方式
账单
输入帐单信息
确认订单
确认订单详细信息
运输
账单
运输
账单
运输
账单
运输
账单