atui
Version:
components built with Vue.js
106 lines (97 loc) • 1.96 kB
Markdown
---
order: 0
title:
zh-CN: 基本
en-US: Type
---
## zh-CN
展示了所有栅格布局样例
## en-US
````jsx
<v-row>
<v-col span="24">col-24</v-col>
</v-row>
<v-row>
<v-col span="23">col-23</v-col>
<v-col span="1">1</v-col>
</v-row>
<v-row>
<v-col span="22">col-22</v-col>
<v-col span="2">2</v-col>
</v-row>
<v-row>
<v-col span="21">col-21</v-col>
<v-col span="3">col-3</v-col>
</v-row>
<v-row>
<v-col span="20">col-20</v-col>
<v-col span="4">col-4</v-col>
</v-row>
<v-row>
<v-col span="19">col-19</v-col>
<v-col span="5">col-5</v-col>
</v-row>
<v-row>
<v-col span="18">col-18</v-col>
<v-col span="6">col-6</v-col>
</v-row>
<v-row>
<v-col span="17">col-17</v-col>
<v-col span="7">col-7</v-col>
</v-row>
<v-row>
<v-col span="16">col-16</v-col>
<v-col span="8">col-8</v-col>
</v-row>
<v-row>
<v-col span="15">col-15</v-col>
<v-col span="9">col-9</v-col>
</v-row>
<v-row>
<v-col span="14">col-14</v-col>
<v-col span="10">col-10</v-col>
</v-row>
<v-row>
<v-col span="13">col-13</v-col>
<v-col span="11">col-11</v-col>
</v-row>
<v-row>
<v-col span="12">col-12</v-col>
<v-col span="12">col-12</v-col>
</v-row>
<v-row>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
<v-col span="1"></v-col>
</v-row>
````
````vue-script
new Vue({
el: 'body',
components: {
vRow: atui.Layout.Row,
vCol: atui.Layout.Col
}
})
````