Как перевернуть цвета кнопок при наведении курсора?

Question

У меня есть белая кнопка с зеленым текстом. Как перевернуть цвета при наведении на зеленую кнопку с белым текстом в моем пространстве?

<a class="fusion-button button-flat button-round button-large button-custom button-1 button" target="_self" href="http://greenhousebuilders.co/about"> 
<span class="fusion-button-text">learn more</span> 
</a> 

Код выглядит так, как показано на рисунке. Это wordpress, поэтому я не могу изменить html, просто css. Я хочу, чтобы цвет диапазона изменялся, когда a зависает. Это возможно? Прямо сейчас я могу получить цвет диапазона, который будет меняться при переходе диапазона.

Answer 1

Попробуйте

.fusion-button { 
 
    border: 1px solid black; 
 
    padding: 3px; 
 
    color: green; 
 
} 
 

 

 
a:hover { background: green; } 
 
a:hover span { color: white }

<a class="fusion-button button-flat button-round button-large button-custom button-1 button" target="_self" href="http://greenhousebuilders.co/about"> 
 
<span class="fusion-button-text">learn more</span> 
 
</a>