悬停时如何改变按钮颜色？

支持
1

你好，感谢你提供的很棒的组件 :slight_smile:

我正在尝试稍微自定义一下按钮的颜色。看起来要更改悬停属性（按钮颜色或文本颜色），我必须更改 CSS。但我无法确切地弄清楚在哪里进行更改。有什么帮助吗？

1 个赞
2

hi @xomiamoore :slight_smile:

你可以尝试类似下面的方法，并根据你的需求调整颜色和其他属性：
在主题或主题组件的通用 CSS 中：

// * 按钮背景  * //

.banner-box .button-container .close, 
.banner-box .button-container .toggle {
    background: silver;
    &:hover {
    background: yellow;
    }
}

// * 按钮文本颜色 //

.banner-box .button-container .close .d-button-label, 
.banner-box .button-container .toggle .d-button-label {
    color: red;
    &:hover {
    color: blue;
    }     
}

// * 箭头图标颜色 * //

.banner-box .button-container .close svg, 
.banner-box .button-container .toggle svg {
    color: grey;
    &:hover {
    color: black;
    }
}

你也可以使用十六进制颜色代码（例如：#000000）或主题变量（例如：var(--secondary）来设置颜色。

5 个赞
3

你好 Mia，

既然了解这一点仍然有益，我们有一个关于此类修改的教程：

3 个赞
4

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.