Question

当我将项目悬停在列表中并且列表文本包含换行符时，悬停效果似乎不一致。

<ul id="nav1" class="greenbullet">
    <li>
        <a href="" class="tsize">Surdite : en Europe, 40 <br />millions de personnes sont concernees</a>
    </li>
    <li>
        <a href="" class="tsize">GuideCaro, une entreprise pionniere, partenaire de Garnier</a>
    </li>
    <li>
        <a href="" class="tsize">Garnier renforce son accessibilite en lancant le service Sourdline </a>
    </li>
</ul>

css

#nav1 { list-style:url(../../img/02-tri-SDB-light/images/greenbullet.png) }

#nav1 li a { text-decoration:none;color:#019b99 }

#nav1 li { margin-left:40px }

#nav1 li:hover, #nav1 li:hover a { list-style:url(../../img/02-    tri-SDB-light/images/puce2.png); color:#FFF;background-color:#019b99; }

如何解决这个问题？

Answer 1

我创造了一个小提琴，但看不出问题。

http://jsfiddle.net/jasongennaro/V654e/

但是，我们无法看到您的list-style因为它们是图片。所以问题可能在那里，特别是:hover风格。 url之后的02似乎有中断？

#nav1 li:hover, #nav1 li:hover a { list-style:url(../../img/02- tri-SDB-light/images/puce2.png); color:#FFF;background-color:#019b99; }

Answer 2

您应该使用#nav1 li a:hover或更简单的#nav1 a:hover。否则，悬停将无法在IE6上运行。

如何更正此错误？

2 个答案: