Flexbox And Grid
Grid Column Start / End
用于控制在网格列中元素的大小和放置方式的功能类。
语法
col-auto
| Class | Properties | 平台兼容性说明 |
|---|---|---|
| col-auto | grid-column: auto; | H5、小程序、app-vue |
col-span-[1-12]
| Class | Properties | 平台兼容性说明 |
|---|---|---|
| col-span-1 | grid-column: span 1 / span 1; | H5、小程序、app-vue |
| col-span-2 | grid-column: span 2 / span 2; | H5、小程序、app-vue |
| col-span-3 | grid-column: span 3 / span 3; | H5、小程序、app-vue |
| col-span-4 | grid-column: span 4 / span 4; | H5、小程序、app-vue |
| col-span-5 | grid-column: span 5 / span 5; | H5、小程序、app-vue |
| col-span-6 | grid-column: span 6 / span 6; | H5、小程序、app-vue |
| col-span-7 | grid-column: span 7 / span 7; | H5、小程序、app-vue |
| col-span-8 | grid-column: span 8 / span 8; | H5、小程序、app-vue |
| col-span-9 | grid-column: span 9 / span 9; | H5、小程序、app-vue |
| col-span-10 | grid-column: span 10 / span 10; | H5、小程序、app-vue |
| col-span-11 | grid-column: span 11 / span 11; | H5、小程序、app-vue |
| col-span-12 | grid-column: span 12 / span 12; | H5、小程序、app-vue |
col-span-full
| Class | Properties | 平台兼容性说明 |
|---|---|---|
| col-span-full | grid-column: 1 / -1; | H5、小程序、app-vue |
col-start-[1-13]
| Class | Properties | 平台兼容性说明 |
|---|---|---|
| col-start-1 | grid-column-start: 1; | H5、小程序、app-vue |
| col-start-2 | grid-column-start: 2; | H5、小程序、app-vue |
| col-start-3 | grid-column-start: 3; | H5、小程序、app-vue |
| col-start-4 | grid-column-start: 4; | H5、小程序、app-vue |
| col-start-5 | grid-column-start: 5; | H5、小程序、app-vue |
| col-start-6 | grid-column-start: 6; | H5、小程序、app-vue |
| col-start-7 | grid-column-start: 7; | H5、小程序、app-vue |
| col-start-8 | grid-column-start: 8; | H5、小程序、app-vue |
| col-start-9 | grid-column-start: 9; | H5、小程序、app-vue |
| col-start-10 | grid-column-start: 10; | H5、小程序、app-vue |
| col-start-11 | grid-column-start: 11; | H5、小程序、app-vue |
| col-start-12 | grid-column-start: 12; | H5、小程序、app-vue |
| col-start-13 | grid-column-start: 13; | H5、小程序、app-vue |
col-start-auto
| Class | Properties | 平台兼容性说明 |
|---|---|---|
| col-start-13 | grid-column-start: auto; | H5、小程序、app-vue |
col-end-[1-13]
| Class | Properties | 平台兼容性说明 |
|---|---|---|
| col-end-1 | grid-column-end: 1; | H5、小程序、app-vue |
| col-end-2 | grid-column-end: 2; | H5、小程序、app-vue |
| col-end-3 | grid-column-end: 3; | H5、小程序、app-vue |
| col-end-4 | grid-column-end: 4; | H5、小程序、app-vue |
| col-end-5 | grid-column-end: 5; | H5、小程序、app-vue |
| col-end-6 | grid-column-end: 6; | H5、小程序、app-vue |
| col-end-7 | grid-column-end: 7; | H5、小程序、app-vue |
| col-end-8 | grid-column-end: 8; | H5、小程序、app-vue |
| col-end-9 | grid-column-end: 9; | H5、小程序、app-vue |
| col-end-10 | grid-column-end: 10; | H5、小程序、app-vue |
| col-end-11 | grid-column-end: 11; | H5、小程序、app-vue |
| col-end-12 | grid-column-end: 12; | H5、小程序、app-vue |
| col-end-13 | grid-column-end: 13; | H5、小程序、app-vue |
col-end-auto
| Class | Properties | 平台兼容性说明 |
|---|---|---|
| col-end-13 | grid-column-end: auto; | H5、小程序、app-vue |