在IE6 CSS中锚标记的span样式设置有问题

Question

我工作的公司仍然使用IE6，因此我需要确保我的网站在IE6浏览器中工作。由于SharePoint 2007代码设计的限制，我在样式方面遇到了麻烦。

当你将鼠标悬停在非活动选项卡上时，文本的颜色应该从蓝色变为橙色。

<div class="webpartBody">
<div class="tabsWrapper">
    <a class="quickLinkTabs activeTab" href="#">
        <span class="tab0">Clinical</span>
    </a>
    <a class="quickLinkTabs" href="#">
        <span class="tab1">Business Services</span>
    </a>
    <a class="quickLinkTabs" href="#">
        <span class="tab2">Employees</span>
    </a>
    <a class="quickLinkTabs" href="#">
        <span class="tab3">Projects</span>
    </a>
    <a class="quickLinkTabs" href="#">
        <span class="tab4">Web Links</span>
    </a>
</div>
<!-- links -->
</div>

jQuery用于为quickLinkTabs创建类，以便firstTab和lastTab被标记为这样，并且当前选择的选项卡是activeTab。

在SharePoint环境之外使用这段代码，我应用以下CSS来实现我正在寻找的效果。

.quickLinkTabs:hover
{
    color: #ff6600;
}
.quickLinkTabs span:hover
{
    color: #ff6600;
}

一旦我把它应用到开发环境中，并在SharePoint生成的代码上尝试它，它就不再工作了。我不知道障碍是什么——是SharePoint吗?是我的CSS吗?

Answer 1

SPAN本来就没有存在的目的。您应该调整a标记的样式以执行相同的功能。

然后使用:

.tabsWrapper a { .... }
.tabsWrapper a:hover { ... }