在Wordpress菜单中使图标悬停

Question

我在WordPress的菜单链接上有一个'：hover'。

如何使：hover效果不仅适用于图标，还适用于“事件”部分？

[https://jsfiddle.net/b5stmnj0/][1]

Answer 1

您只需要将.icon:hover更改为a:hover .icon

在此处https://jsfiddle.net/oLpes7nh/参见小提琴

CSS：

a:hover .icon {
  width: 50px;
  height: 50px;
  padding-right: 10px;
  background-color: #e6e1d7;
  -webkit-mask: url(https://svgshare.com/i/Bpz.svg) no-repeat center;
  mask: url(https://svgshare.com/i/Bpz.svg) no-repeat center;
}