/** * @license * Copyright 厦门乾元盛世科技有限公司 All Rights Reserved. * * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file. */ import { ElementRef, Renderer } from '@angular/core'; import { Row } from './row'; export interface ColSize { span?: number; order?: number; offset?: number; push?: number; pull?: number; } /** * 24 栅格系统 之 Column * 布局的栅格化系统,我们是基于行(row)和列(col)来定义信息区块的外部框架,以保证页面的每个区域能够稳健地排布起来。下面简单介绍一下它的工作原理: * * - 通过`row`在水平方向建立一组`column`(简写col) * - 你的内容应当放置于`col`内,并且,只有`col`可以作为`row`的直接元素 * - 栅格系统中的列是指1到24的值来表示其跨越的范围。例如,三个等宽的列可以使用`.col-8`来创建 * - 如果一个`row`中的`col`总和超过 24,那么多余的`col`会作为一个整体另起一行排列 */ export declare class Col { private renderer; private _elementRef; private row; /** 样式前缀 */ prefixCls: string; span: number; /** 栅格顺序,flex 布局模式下有效 */ order: number; /** 栅格左侧的间隔格数,间隔内不可以有栅格 */ offset: number; /** 栅格向右移动格数 */ push: number; /** 栅格向左移动格数 */ pull: number; /** <768px 响应式栅格,可为栅格数或一个包含其他属性的对象 */ xs: number | ColSize; /** >=768px 响应式栅格,可为栅格数或一个包含其他属性的对象 */ sm: number | ColSize; /** ≥992px 响应式栅格,可为栅格数或一个包含其他属性的对象 */ md: number | ColSize; /** ≥1200px 响应式栅格,可为栅格数或一个包含其他属性的对象 */ lg: number | ColSize; /** ≥1600px 响应式栅格,可为栅格数或一个包含其他属性的对象 */ xl: number | ColSize; /** 用户CSS样式 */ class: string; constructor(renderer: Renderer, _elementRef: ElementRef, row: Row); /** * The underlying host native element */ getHostElement(): HTMLElement; /** * 最终样式 */ readonly classes: string; /** * 特殊样式 */ readonly marginLeft: any; /** * 特殊样式 */ readonly marginRight: any; }