Question

我需要在素材UI中悬停时更改凸起的按钮背景颜色。尝试了这个但不起作用，有没有办法改变材料Ui中的背景颜色，凸起按钮？

Exemple.JS

<RaisedButton 
        className="bouton"
        secondary={false}
        label="CONNEXION"
        fullWidth={true}
        labelPosition="before"
        icon={<img src="../../images/next.png" />}
        onTouchTap={() => signinWithEmailAndPassword(document.getElementById('Email').value, document.getElementById('password').value)}
        />

Exemple.css

    .bouton{
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: #00BCD4;
}

    .bouton:hover{
        background-color: #00BCD4;
        color: #FFF;
    }

Answer 1

如果您没有将图像设置为背景，则可以更改颜色宽度background-color，但您需要选择重量的选择器。

下一个代码用于检查您的按钮。

.bouton{
   position: absolute;
   bottom: 0;
   left: 0;
   background-color: #00BCD4 !important;
}

.bouton:hover{
    background-color: green !important;
    color: #FFF;
}

!important将最大权重设置为选择器，除检查样式外，此不使用。

如果你的按钮改变颜色设置类，那么选择器的重量将很好作为当前选择器

材质UI凸起按钮在悬停时更改颜色

1 个答案: