5

我一直在网站上看到 60-80% 的不透明度。他们看起来真的很酷，但我不确定他们为什么要这样做。是 Javascript，还是图像？如何更改表格的不透明度？

4

6 回答 6

29

你可以在 CSS 中做到这一点，但它需要一点黑客才能让它跨浏览器工作。

selector {
    filter: alpha(opacity=50); /* internet explorer */
    opacity: 0.5;           /* fx, safari, opera, chrome */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=50)"; /*IE8*/
}
于 2009-05-13T16:36:58.787 回答
2

IE 使用语法 filter:alpha(opacity=80)，较低的值使元素更透明，而 Mozilla 使用 -moz-opacity:0.8，较低的值对透明度具有相同的效果。CSS3 有效语法 opacity:0.8; 也是如此。

这就是你需要的三个 CSS 属性。

过滤器：alpha（不透明度=80）；//IE

不透明度：0.8；//CSS3

-moz-不透明度：0.8；//Mozilla

于 2009-05-13T16:38:14.807 回答
1

您还可以创建一个 1x1 像素的 32 位 PNG 图像，例如具有您需要的不透明度的黑色正方形。然后在你的CSS中你可以做......

element
{
    background: url(/Images/Transparent.png) repeat;
}

这样你就可以避免所有不同的黑客攻击。您可能在 IE6 中遇到 Alpha 透明度问题，但也有解决此问题的方法

于 2009-05-13T16:48:22.277 回答
1

不透明度可以在 CSS 中指定，但并非所有浏览器都支持（特别是较旧的 IE）

于 2009-05-13T16:36:15.870 回答
0

如果您想要一个广泛的“跨浏览器”解决方案，除了 IE6（完全弃用），这将始终有效：

div {
    background-image: url('opacity.png');
}

“opacity.png”是 1px x 1px 透明 PNG24

它确实会向您的服务器生成一个额外的请求，但在大多数情况下，它完全可以负担​​得起。

于 2011-10-28T05:32:40.350 回答
0

它可以通过两种方式完成，我更喜欢 alpha 透明 png 文件作为背景。在桌子上做一个 alpha 使实际内容也是半透明的。请参阅 css 值的其他答案。

于 2009-05-14T08:02:18.973 回答