Question

我有一份简单的<±/strong><ul> and <li> tabs with some CSS ppliednofollow noreferer”>>on jsfiddle here 。

基本上,每个表格都有格式(请对上述编码进行更详细的核对):

... <li class="icons ..."> <a href="#"></a> <li> ...

As you saw in the code, the icon on each tab is actually the background image of each <li> element.

当mouse hovers on a tab时,我还要改变<a> 内容。当我尝试这样做时,mouse hover 然后,hides/strong> 表格图(<li> background-image)。我怎么能够摆脱这种状况?

<>0> 说我的问题的另一种方式页: 1

What I mean is I have already had a background-image for <li> element, then I also want to have a background-image for <a> element which is contained by <li>, but if I did so (that s have both <li> and <a> has background-image with also :hover background-image), the background-image of <a> will hide the background-image of <li>, how to get rid of this problem?

-------------Please check @ hradac s reply, he understands my question correctly---------

Answer 1

Change the background-color of the LI containing your A instead.
That way your background-image won t be hidden by the A background-color.
See http://jsfiddle.net/Pq7LC/21/

Answer 2

将这一部分从你手中删除:

a:hover
{
    color: #ffffff;
    background-color: #990000;
}

http://jsfiddle.net/ryZ4j/2/>rel=“nofollow> http://jsfiddle.net/ryZ4j/2/。

Answer 3

从我可以收集到的,希望在<代码><li>上有一个背景形象,在<代码><a>中有一个背景形象。您的代码没有包含<代码><a>标签的任何背景图像。页: 1 转换在<代码><li>要素上。

这个问题似乎是一个分层的问题。如果您对载于<代码><a>的标签适用背景说明,则不能再看<代码><li>。那里的背景形象仍然存在,你可以看到。我建议修改<代码><li> on :hover,并留下<代码><a> on transparency。这样,你就能够看到<代码><li>背景形象。

See an example here: 。

难道这更像你所期待的吗?

友情链接