Изменить цвет и фон после контента при наведении

Question

Необходимо изменить фон окна поиска на прозрачный, а значок поиска - на белый При наведении курсора.Я пытался, но не смог достичь цели.

Я хочу применить наведенный CSS в следующем коде.

fusion-main-menu .fusion-main-menu-search a:after {
    font-family: FontAwesome;
    color: #5b646d !important;
    background: #fff;
    padding: 8px 10px;
    border-radius: 4px;
}

Answer 1

Использование a:hover:after{}

Например

a:after{
   font-family: "Font Awesome 5 Free";
   content: "\f095";
   display: inline-block;
   padding-right: 3px;
   vertical-align: middle;
   font-weight: 900;
}
a:hover:after{
color:red;
}

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" integrity="sha384-gfdkjb5BdAXd+lj+gudLWI+BXq4IuLW5IT+brZEZsLFm++aCMlF1V92rMkPaX4PP" crossorigin="anonymous">
<a>try me</a>