1

我有一个网页的 CSS 样式表。该网页有一个背景颜色为白色的表格(设置在行中,而不是表格中)。我想将不透明度或 alpha 设置为 50%。我尝试了很多变化,但没有运气。

HTML 文件中的典型行是:

<tr>
  <td>&nbsp;</td>
  <td>Twitter</td>
</tr>

表格行的 CSS 设置(效果很好)是:

tr {
    font-family: Arial, Helvetica, sans-serif; background:rgb(255,255,255);  
}

为了获得阿尔法,我试过了

tr {
        font-family: Arial, Helvetica, sans-serif; background-color:rgba(255,255,255,0.5);  
    }

我也试过background-color-opacity: 0.5

还有其他建议吗?

4

4 回答 4

3

首先,并不是所有浏览器都以同样的方式支持它!要在 FF、Opera、Chrome 等中获得您想要的结果,您可以使用以下 2 行 CSS:

background-color: rgba(255, 255, 255, .5);
color: rgba(255, 255, 255, .5);

这个链接也有助于获取各种类型的 CSS3 代码。

恐怕如果你想在 IE 上工作 alpha 属性,那么对于不同的版本,你必须使用不同的类型代码。你可以在这里谷歌。

希望对你有帮助!干杯:)

于 2012-04-12T16:34:24.180 回答
1

是否有我们可以查看的实时示例或可以重现该问题的 JSFiddle?

这是一个概念证明,表明您的 CSS 应该可以工作:http: //jsfiddle.net/anstosa/VVA6q/

您可能会从其他一些 CSS 中得到冲突

于 2012-04-12T16:20:11.013 回答
1

尝试

tr {
    background-color:rgba(255,255,255,0.5);
}

或者

table {
    background-color:rgba(255,255,255,0.5);
}

你可以在这里看到一个活生生的例子

于 2012-04-12T16:17:45.890 回答
1

如果你想让表格被看穿,http://jsfiddle.net/YyNmG/

HTML

<table>
<tr>
  <td>&nbsp;</td>
  <td>Twitter</td>
</tr>
<tr>
  <td>&nbsp;</td>
  <td>Twitter</td>
</tr>
<tr>
  <td>&nbsp;</td>
  <td>Twitter</td>
</tr>
</table>​

CSS

table{
    background-color:rgba(100,100,100,0.4);
}
body{
    background-color:red;
}​

如果只有 TRs,http://jsfiddle.net/YyNmG/1/

tr{
    background-color:rgba(100,100,100,0.4);
}
table{background-color:black;}
body{
    background-color:red;
}
于 2012-04-12T16:25:00.683 回答