70 lines
1.4 KiB
CSS
70 lines
1.4 KiB
CSS
/* 主要的按钮样式处理 */
|
|
/*鼠标点击后移开，恢复本身样式*/
|
|
.primary,
|
|
.primary:focus:not(.primary:hover) {
|
|
color: white;
|
|
background: #409eff;
|
|
}
|
|
|
|
/*鼠标悬浮，没有按下；鼠标按下后抬起，没有移开*/
|
|
/* 更改背景和字體顏色 */
|
|
.primary:focus,
|
|
.primary:hover {
|
|
color: white;
|
|
background: #409eff;
|
|
}
|
|
|
|
/*鼠标按下，没有抬起*/
|
|
/* 更改邊框顏色 */
|
|
.primary:active {
|
|
color: white;
|
|
background: #337ecc;
|
|
}
|
|
|
|
|
|
/*鼠标点击后移开，恢复本身样式*/
|
|
.danger,
|
|
.danger:focus:not(.danger:hover) {
|
|
color: white;
|
|
background: #f56c6c;
|
|
}
|
|
|
|
/* 危险的按钮样式 */
|
|
/*鼠标悬浮，没有按下；鼠标按下后抬起，没有移开*/
|
|
/* 更改背景和字體顏色 */
|
|
.danger:focus,
|
|
.danger:hover {
|
|
color: white;
|
|
background: #f56c6c;
|
|
}
|
|
|
|
/*鼠标按下，没有抬起*/
|
|
/* 更改邊框顏色 */
|
|
.danger:active {
|
|
color: white;
|
|
background: #c45656;
|
|
}
|
|
|
|
|
|
/*鼠标点击后移开，恢复本身样式*/
|
|
.success,
|
|
.success:focus:not(.success:hover) {
|
|
color: white;
|
|
background: #67c23a;
|
|
}
|
|
|
|
/* 危险的按钮样式 */
|
|
/*鼠标悬浮，没有按下；鼠标按下后抬起，没有移开*/
|
|
/* 更改背景和字體顏色 */
|
|
.success:focus,
|
|
.success:hover {
|
|
color: white;
|
|
background: #b3e19d;
|
|
}
|
|
|
|
/*鼠标按下，没有抬起*/
|
|
/* 更改邊框顏色 */
|
|
.danger:active {
|
|
color: white;
|
|
background: #529b2e;
|
|
} |