update demo

This commit is contained in:
梁灏 2018-01-30 11:04:12 +08:00
parent 7a2f62ed52
commit a9c00cd62d

View file

@ -1,25 +1,152 @@
<style>
/*.ivu-col div{*/
/*background: rgba(0,153,229,.7);*/
/*}*/
.view {
height: 100px;
width: 100px;
background: yellow;
}
</style>
<template>
<div>
<Row :gutter="64">
<Card>
<i-col span="6">
<div>col-6</div>
</i-col>
<i-col span="6">
<div>col-6</div>
</i-col>
<i-col span="6">
<div>col-6</div>
</i-col>
<i-col span="6">
<div>col-6</div>
</i-col>
</Card>
<Row type='flex' justify='center'>
<i-col span='21' class="offset-header">
<Row type='flex' :gutter='16' justify='space-between'>
<i-col :order='25'>
<div class="view">
<label>245</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='1'>
<div class="view" >
<label>1</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='2'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='3'>
<div class="view" >
<label>3</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='4'>
<div class="view" >
<label>4</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='5'>
<div class="view" >
<label>5</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='6'>
<div class="view" >
<label>6</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='7'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='8'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='9'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='10'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='11'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='12'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='13'>
<div class="view" >
<label>12</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='14'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='15'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='16'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='17'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='18'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='19'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='20'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='21'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='22'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='23'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='24'>
<div class="view" >
<label>2</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='25'>
<div class="view" >
<label>25-------</label>
</div>
</i-col>
<i-col :xs='12' :sm='12' :md='8' :lg='8' :order='26'>
<div class="view" >
<label>26------</label>
</div>
</i-col>
</Row>
</i-col>
</Row>
</div>
</template>