vue（el-button的五种类型，三种css格式）_vue el-button

在写一个系统的css文件的时候，发现了不同类型的button的初始颜色不同，为了完美的使button的颜色和背景的颜色相映照，就去搜了一下，小做总结，为以后的使用做准备。

<div>
    <el-button><span>默认按钮</span></el-button>
    <el-button type="primary"><span>主要按钮</span></el-button>
    <el-button type="success"><span>成功按钮</span></el-button>
    <el-button type="info"><span>信息按钮</span></el-button>
    <el-button type="warning"><span>警告按钮</span></el-button>
    <el-button type="danger"><span>危险按钮</span></el-button>
  </div>
1
2
3
4
5
6
7
8

  <div style="margin: 20px 0">
    <el-button><span>朴素按钮</span></el-button>
    <el-button type="primary"><span>主要按钮</span></el-button>
    <el-button type="success"><span>成功按钮</span></el-button>
    <el-button type="info"><span>信息按钮</span></el-button>
    <el-button type="warning"><span>警告按钮</span></el-button>
    <el-button type="danger"><span>危险按钮</span></el-button>
  </div>
1
2
3
4
5
6
7
8

  <div>
    <el-button round><span>圆形按钮</span></el-button>
    <el-button type="primary" round><span>主要按钮</span></el-button>
    <el-button type="success" round><span>成功按钮</span></el-button>
    <el-button type="info" round><span>信息按钮</span></el-button>
    <el-button type="warning" round><span>警告按钮</span></el-button>
    <el-button type="danger" round><span>危险按钮</span></el-button>
  </div>
1
2
3
4
5
6
7
8

需要的话自取，如果说要记的话，可以记一下下面这几点。
a.round设置圆边按钮
b.
默认白
主要蓝 primary
成功绿 success
信息灰 info
警告橘黄 warning
危险红 danger

每天都会有奇迹。
——阿甘正传

在学习的过程中，自学为主的话，可以推荐你去看看element的官网，比我这里全哦，这里送上链接:
elementUI