在写一个系统的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>
<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>
<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>
需要的话自取,如果说要记的话,可以记一下下面这几点。
a.round设置圆边按钮
b.
默认白
主要蓝 primary
成功绿 success
信息灰 info
警告橘黄 warning
危险红 danger
每天都会有奇迹。
——阿甘正传
在学习的过程中,自学为主的话,可以推荐你去看看element的官网,比我这里全哦,这里送上链接:
elementUI