CSS 表格单元格透明度答案

【问题标题】：CSS Table Cell TransparencyCSS 表格单元格透明度
【发布时间】：2014-02-02 16:53:47
【问题描述】：

对网页设计相当陌生，我正在尝试制作一个透明的表格单元格。

我有一个很好的纹理图像作为我的身体背景，我希望我的桌子有一个白色背景，除了左上角的一个空单元格，我希望它完全不可见。

我已尝试#id-ing 空单元格并将背景颜色设置为透明，但它只是设置为白色。我在表格选择器中将表格背景设置为白色，但我认为我的 id 选择器会覆盖它。

我还尝试在单元格上设置带纹理的背景图像以使其看起来透明，但它就像拇指酸痛一样突出。

有什么想法吗？

【问题讨论】：

标签： html css web html-table

【解决方案1】：

我已尝试#id-ing 空单元格并将背景颜色设置为透明，但它只是设置为白色。我在表格选择器中将表格背景设置为白色，但我认为我的 id 选择器会覆盖它。

它们是不同的元素。 id 选择器不会覆盖它，因为它匹配不同的元素。

表格单元格是透明的。桌子本身是白色的。可以透过表格单元格的透明背景看到其后面表格的白色背景。

如果你想看到body元素的背景，那么你必须将表格的背景也设置为透明。可能您想将每个 other 单元格的背景设置为白色。

【讨论】：

【解决方案2】：

你可以试试这个：

#my-invisible-cell { opacity: 0; }

或

#my-invisible-cell { visibility: hidden; }

如果问题仍然存在，则可能是表中有问题；在这种情况下，试试这个：

<style>
table {
    background: transparent !important;
}

.white-cells {
    background: white;
}
</style>
<table>
    <tr>
        <td class="white-cells">White cell</td>
        <td></td>
        <td class="white-cells">White cell</td>
    </tr>
</table>

【讨论】：