按钮颜色样式

最新推荐文章于 2025-06-01 09:58:00 发布

weixin_30586257

最新推荐文章于 2025-06-01 09:58:00 发布

阅读量4.6k

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/shy1766IT/p/11234776.html

本文详细介绍了 Element UI 中不同状态按钮的颜色样式配置，包括主要按钮、成功按钮、警告按钮等，并提供了具体的 CSS 样式代码。此外还解释了警告按钮在悬停和焦点状态下的样式变化。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

按钮颜色样式

.el-alert--success {
background-color: #e7faf0;
color: #13ce66;
}

.el-alert--warning {
background-color: #fff8e6;
color: #FFBA00;
}

.el-alert--info {
background-color: #f4f4f5;
color: #909399;
}

.el-button--primary {
color: #FFFFFF;
background-color: #1890ff;
border-color: #1890ff;
}

.el-button--success {
color: #FFFFFF;
background-color: #13ce66;
border-color: #13ce66;
}
.el-button--danger {
color: #FFFFFF;
background-color: #ff4949;
border-color: #ff4949;
}
.el-button--warning:hover, .el-button--warning:focus {
background: #ffc833;
border-color: #ffc833;
color: #FFFFFF;
}

转载于:https://www.cnblogs.com/shy1766IT/p/11234776.html