Vue Vuetify編 -初学- ~デザインは価値！~

Vuetifyとは

Vue.js用、マテリアルデザインのフレームワーク！

まずマテリアルデザインとは
シンプルなデザインでディスプレイサイズに合わせて最適化しやすくしよう
というGoogleが発表したデザインガイドライン。(2014年)

Vuetify使い方

<template>
  <v-app>
    <v-content>
      <v-container fluid>
        <v-layout wrap>
          <v-flex xs12 sm5></v-flex>
          <v-flex xs12 sm5></v-flex>
        </v-layout>
      </v-container>
    </v-content>
  </v-app>
</template>

v-app
Veutifyを使うために必須！
Vuetifyのコンポーネントは必ずv-app要素の内側に書く！

v-content
レイアウトシステム！
とりあえずかく！

v-container
コンテナです。
オプション属性で幅や位置を変更する。

v-layout
レイアウトにはこれ！
wrap属性をつける！

v-flex
v-layoutの内側に使うことでグリッドシステムが使える！
12分割だからbootstrapとかと同じ。
v-layoutにwrap属性がないと使えないから注意！

勉強してもっと詳しく書きます！
以上！