Css 悬停时更改字体图标颜色

我正在使用图标插件，但是当我将鼠标悬停在

元素上时，我需要将其图标更改为

颜色：蓝色

。我做了测试，但到目前为止没有得到任何结果。有人能帮忙吗

代码：

.collapsedMenu\u项目{
宽度：50px；
高度：36px；
保证金：自动；
背景颜色：绿色；
列表样式：无；
}
.collapsedMenu\uu项目范围{
文本对齐：居中；
显示：内联块；
宽度：100%；
身高：100%；
填充顶部：10px；
}
.collapsedMenu\u项目a{
颜色：#dad8de；
身高：100%；
显示：块；
}
.collapsedMenu\u项目：悬停{
颜色：蓝色；
背景色：#2ebd59；
过渡：颜色.25s，背景.25s；
}
.促销链接{
盒影：3px0#6441a4插页；
}

您可以使用以下CSS代码：

/* To use a transition for 'color'. */
.collapsedMenu__item a {
   transition: color .25s;
}

.collapsedMenu__item:hover a {
  color: blue;
}

jsFiddle:→ .

---

片段：

/*----CSS-----*/
.折叠菜单项{
宽度：100px；
高度：36px；
保证金：自动；
背景颜色：绿色；
列表样式：无；
}
.collapsedMenu\uu项目范围{
文本对齐：居中；
显示：内联块；
宽度：100%；
身高：100%；
填充顶部：10px；
}
.collapsedMenu\u项目a{
颜色：#dad8de；
身高：100%；
显示：块；
}
.collapsedMenu\u项目：悬停{
背景色：#2ebd59；
过渡：颜色.25s，背景.25s；
}
.促销链接{
盒影：3px0#6441a4插页；
}
.collapsedMenu\u项目a{
过渡：颜色。25s；
}
.collapsedMenu\u项目：将鼠标悬停在a上{
颜色：蓝色；
}

您可以使用以下CSS代码：

/* To use a transition for 'color'. */
.collapsedMenu__item a {
   transition: color .25s;
}

.collapsedMenu__item:hover a {
  color: blue;
}

jsFiddle:→ .

---

片段：

/*----CSS-----*/
.折叠菜单项{
宽度：100px；
高度：36px；
保证金：自动；
背景颜色：绿色；
列表样式：无；
}
.collapsedMenu\uu项目范围{
文本对齐：居中；
显示：内联块；
宽度：100%；
身高：100%；
填充顶部：10px；
}
.collapsedMenu\u项目a{
颜色：#dad8de；
身高：100%；
显示：块；
}
.collapsedMenu\u项目：悬停{
背景色：#2ebd59；
过渡：颜色.25s，背景.25s；
}
.促销链接{
盒影：3px0#6441a4插页；
}
.collapsedMenu\u项目a{
过渡：颜色。25s；
}
.collapsedMenu\u项目：将鼠标悬停在a上{
颜色：蓝色；
}

啊，不，当我将鼠标悬停在

上方时，图标也会改变颜色。这正是代码@dee cheok所做的。查看。我很高兴我可以帮助你@deecheok天使波利蒂斯如果添加一个文本如何？我使用相同的方法，但不起作用。它不起作用，因为您没有添加我的代码块。不，当我把鼠标悬停在

上时，图标也会改变颜色。这正是代码@dee cheok所做的。查看。我很高兴我可以帮助你@deecheok天使波利蒂斯如果添加一个文本如何？我使用相同的方法，但不起作用。它不起作用，因为您没有添加我的代码块。退房