Question

我有一个表的代码，我有三个单元格。我希望每个单元格都有不同的背景图像。但问题是，只有第一个单元格显示图像！请帮忙！我的代码：

我更改了#topbar td width！

成功代码：

#topbar {
        width: 100%;
        color: transparent;
        font-size: 13px;
        border-spacing: 0px;
        white-space: nowrap;
    }
    #topbar td {
        width: 8.33333%;
        margin: 0px;
        padding: 0px;
    }
    #topbar td {
        height: 15px;
        margin: 0px;
        background-color: transparent;
        white-space: nowrap;
        cursor: pointer;
    }
    #topbar td:hover {
        background-color: transparent;
    }
    #topbar td.selected {
        font-weight: bold;
        color: #FFFFF;
    }
    #topbar td.empty {
        cursor: auto;
    }
    #topbar td.empty:hover {
        background-color: #2d2d2d;
    }
    #topbar td span {
        display: image;
    }

旧代码在标题

中

#topbar {
    width: 100%;
    color: transparent;
    font-size: 13px;
    border-spacing: 0px;
    white-space: nowrap;
}
#topbar td {
    width: 100%;
    margin: 0px;
    padding: 0px;
}
#topbar td {
    height: 15px;
    margin: 0px;
    background-color: transparent;
    white-space: nowrap;
    cursor: pointer;
}
#topbar td:hover {
    background-color: transparent;
}
#topbar td.selected {
    font-weight: bold;
    color: #FFFFF;
}
#topbar td.empty {
    cursor: auto;
}
#topbar td.empty:hover {
    background-color: #2d2d2d;
}
#topbar td span {
    display: image;
}

身体：

<table id="topbar">
    <tr>
        <td class="box2d" style="background: url(http://osxcrash.webs.com/MacBarMain.PNG) no-repeat">
        <td class="box2d" style="background: url(http://osxcrash.webs.com/MacBar.PNG) no-repeat">
        <td class="box2d" style="background: url(http://osxcrash.webs.com/MacBar2.png) no-repeat">
    </tr>
</table>

Answer 1

图像全部显示，所有图像都在彼此之上，所以你只能看到第一个。

不确定您希望它们显示的方式，但将display:block;添加到#topbar td规则会阻止它们彼此重叠

编辑：如果您希望在同一行显示它们，则需要为每个TD元素指定宽度值。当前设置的100％值占用全屏，因此模糊了其他TD元素的视图

示例：http://jsfiddle.net/mZEWN/

Answer 2

尝试关闭你的TD balise：

<table id="topbar">
    <tr>
        <td class="box2d" style="background: url(http://osxcrash.webs.com/MacBarMain.PNG) no-repeat"/>
        <td class="box2d" style="background: url(http://osxcrash.webs.com/MacBar.PNG) no-repeat"/>
        <td class="box2d" style="background: url(http://osxcrash.webs.com/MacBar2.png) no-repeat" />
    </tr>
</table>

单元格未显示背景图像

2 个答案: