如何使用CSS访问此元素

Question

我在HTML中有这个自动生成的代码。

如何使用CSS获取span类图标以在悬停时修改它。

我无法拨打.icon，因为我会更改页面上的所有图标，我只想更改此图标。

<li class="level1 item156">
       <a class="carpo1 level1" href="/carpooling" title="carpoT">
           <span>
               <span class="icon" style="background-image: url('http://thebackpackerweb.estrategic.es/images/EntregaProyecto/Icon_carpooling_h.png');"></span>
           carpooling
           </span>
        </a>
 </li>

Answer 1

我可能会选择

.item156 .icon {
    background: red;
}

Answer 2

这将按预期工作：

.item156 .icon:hover {
    background: blue;
}

Answer 3

将此特定span类赋予id，然后根据您的要求进行更改。