html - 使用CSS在悬停时更改图像

Question

我对 css 了解不多，但我该怎么做才能更改子菜单上的元素符号图像？

#leftCntr .menuBox ul li a { padding: 0px 0px 0px 54px; color: #7d9696; text-decoration: none; background: url(../images/menuDisc.gif) 10px 4px no-repeat; }
        #leftCntr .menuBox ul li a.active { color: #949494; background: url(../images/menuDiscHover.gif) 10px 4px no-repeat; }
        #leftCntr .menuBox ul li a:hover { color: #000000; background: url(../images/menuDiscHover.gif) 10px 4px no-repeat; }       

Answer 1

如果没有看到您的 HTML 代码很难判断，但我猜应该是这样的:

#leftCntr .menuBox ul li a {
    padding: 0px 0px 0px 54px;
    color: #7d9696;
    text-decoration: none;
    background: url(../images/menuDisc.gif) 10px 4px no-repeat;
}

#leftCntr .menuBox ul li a.active {
    color: #949494;
    background: url(../images/menuDiscHover.gif) 10px 4px no-repeat;
}

#leftCntr .menuBox ul li a:hover {
    color: #000000;
    background: url(../images/menuDiscHover.gif) 10px 4px no-repeat;
}

#leftCntr .menuBox ul li li a {
    background: url(../images/submenuDisc.gif) 10px 4px no-repeat; /* Set the image here */
}