col 列组件

行组件用于组织其他组件。

TIP

Col 组件对应 GvCol。下方示例可直接交互，点击「显示代码」查看源码。

基础用法

使用列创建基础网格布局。

通过 GvRow 和 GvCol 组件，并通过 GvCol 组件的 span 属性我们就可以自由地组合布局。

混合布局

通过基础的 1/24 分栏任意扩展组合形成较为复杂的混合布局。

列偏移

可以指定列偏移量。

通过制定 col 组件的 offset 属性可以指定分栏偏移的栏数。

响应式布局

预设了五个响应尺寸：xs、sm、md、lg 和 xl。

自定义元素标签用法

可见性控制

设置列是否可见。

API

Attributes

属性名	说明	类型	默认值
span	设置col的占用列（一行24列）	number	24
offset	设置col的偏移	number	0
xs	设置手机屏幕大小显示	number	-
sm	设置手机屏幕大小显示	number	-
md	设置pad屏幕大小显示	number	-
lg	设置pc屏幕大小显示	number	-
xl	设置大屏幕大小显示	number	-
tag	设置col渲染的html tag属性	string	div
visible	设置col是否可见	boolean	true

类型定义

interface ColProps {
  span?: number;
  offset?: number;
  xs?: number;
  sm?: number;
  md?: number;
  lg?: number;
  xl?: number;
  tag?: string;
  visible?: boolean;
}