Element-ui的安装及基础使用（一）

Element，基于 Vue 2.0 的桌面端UI组件库

Element-UI中文文档地址...

一、安装

• Vue中main.js中引入使用
  1、安装：
  npm i element-ui -S
  2、引入（组件、样式）：
  import ElementUI from 'element-ui'; 引入全部组件
  import { Button, Select } from 'element-ui';引入局部组件
  import 'element-ui/lib/theme-chalk/index.css';
  3、Vue使用：
  Vue.use(ElementUI)

二、使用layout布局

1、通过24 分栏创建布局

• 1.1.基础布局

  
  

• 1.2.分栏间隔gutter属性指定间隔
  

• 1.3.对齐方式。设置属性赋值为flex，可以启用 flex 布局，并可通过justify属性来指定 start, center, end, space-between, space-around其中的值来定义子元素的排版方式。
  

• 1.4.响应式布局.参照了 Bootstrap 的 响应式设计，预设了五个响应尺寸：xs、sm、md、lg 和xl。
  

2、常用属性

• el-row（行标签才能设置以下属性）

• el-col（列标签才能设置以下属性）