-1

该网站在这里

在此页面上,您可以看到选项卡当前为蓝色,但我目前正在处理脱机文件,我正在将其转换为在整个网站设计中都可以看到的自然绿色。不幸的是,我不知道我做了什么,感觉我疲倦的眼睛无法注意到错误......无论是在代码中还是在图像中......

离线标签导航问题:http: //i255.photobucket.com/albums/hh157/redbairn/Oops_zps240d13a5.jpg

[下面的代码是Tab导航的当前代码:]

     div.content {
    border: 3px solid #095;
    clear: left;
    padding: 1em;
    overflow:hidden;
}

div.content.inactive {
    display: none;
}

ol#toc {
    height: 2em;
    list-style: none;
    margin: 0;
    padding: 0;
}

ol#toc a {
    background: #bdf url(tabs.gif);
    display: block;
    float: left;
    height: 2em;
    padding-left: 10px;
    text-decoration: none;
}

ol#toc a:hover {
    background-color: #3af;
    background-position: 0 -120px;
}

ol#toc a:hover span {
    background-position: 100% -120px;
}

ol#toc li {
    float: left;
    margin: 0 1px 0 0;
}

ol#toc li a.active {
    background-color: #095;
    background-position: 0 -60px;
    color: #fff;
    font-weight: bold;
}

ol#toc li a.active span {
    background-position: 100% -60px;
}

ol#toc span {
    background: url(tabs.gif) 100% 0;
    display: block;
    line-height: 2em;
    padding-right: 10px;
}

[离线/新代码:]

div.content {
        border: 3px solid #095;
        clear: left;
        padding: 1em;
        overflow:hidden;
}

div.content.inactive {
        display: none;
}

ol#toc {
    height: 2em;
    list-style: none;
    margin: 0;
    padding: 0;
}

ol#toc a {
        color: #008;
        display: block;
        float: left;
        height: 2em;
        padding-left: 10px;
        text-decoration: none;
        background-color: #6c9;
        background-image: url(tabs.gif);
}

ol#toc a:hover {
        background-color: #0c6;
        background-position: 0 -120px;
}

ol#toc a:hover span {
    background-position: 100% -120px;
}

ol#toc li {
    float: left;
    margin: 0 1px 0 0;
}

ol#toc li a.active {
        background-color: #096;
    background-position: 0 -60px;
    color: #fff;
    font-weight: bold;
}

ol#toc li a.active span {
    background-position: 100% -60px;
}

ol#toc span {
    background: url(tabs.gif) 100% 0;
    display: block;
    line-height: 2em;
    padding-right: 10px;
}
4

1 回答 1

0

我认为它的形象。虽然您将背景颜色设置为透明是正确的,但在我看来,图像本身看起来像是白​​色背景。在编辑器中打开图像,您会注意到图像中的白色背景。我认为,如果您将其从图像中删除,一切都会看起来很棒!

希望这对你有帮助!

仅供参考,在较旧的浏览器(如 IE5)中,透明不能很好地工作。

于 2013-01-13T22:04:01.513 回答