响应式布局

一、五种响应尺寸>>>>Col Attribute（列属性）

参照 bootstrap 的响应式设计，预设了五个响应尺寸，xs、sm、md、lg、xl。当显示大小 从最小到最大时，响应依次为 xs、sm、md、lg、xl。

二、行属性>>>>Row Attribute

三、Demo

vue内容垂直和水平居中:
1、垂直居中
<v-layout row wrap  align-center justify-center fill-height ></v-layout>
2、水平居中
<v-card-text class="mx-auto"></v-card-text>

<v-layout
      flex-child
      wrap
      align-center
      justify-center
      fill-height
    >
      <v-flex
        xs12
        md4
        d-flex
      >
        <v-sheet
          class="d-flex"
          color="grey lighten-3"
          height="424"
          style="background-image: url('https://cdn.vuetifyjs.com/images/cards/desert.jpg');background-size: 100% 100%;"
        >
          <sheet-footer>
            这是第一个
          </sheet-footer>
        </v-sheet>
      </v-flex>
</v-layout>