我试图创建一个使用半透明按钮（和文本区域）的游戏（Alpha约为60％）。除了这些半透明项目，我几乎可以在XHTML和CSS中做我想做的一切。因此，我正在寻找在我的网页上创建半透明图像的最简单方法。
到目前为止的想法：
使用半透明像素创建PNG。这应该是可能的，并且有明确定义的接口用于使用PHP和GD包定义Alpha通道。问题：我试过这个，但是在我尝试过的所有浏览器中，图像都是不透明的（Chrome，IE8，FF）。
在Flash中执行此操作。我知道如何使用Flash（*）从我退休前的一些工作中使用。问题：Flash是专业开发人员的价格，而不是业余爱好者。
（*）嗯，Flash 8.但据我所知，即使是较新的版本，我仍可以继续以旧方式创建电影剪辑，它们只是被翻译成一堆AS。并且可以继续使用AS2，尽管你不能混合使用AS2和AS3。
在Flex中执行此操作。问题：界面最好描述为奥术。即使使用经验丰富的Flex开发人员的建议，尝试包含来自另一个mxml文件（不是作为类）的代码也是PITA。
使用SVG。这看起来很有希望SVG语法基本上是XML，元素标签相当明显，属性的交互只是略有晦涩，本教程中有很多例子。但是......目前约有一半的浏览器不支持在＆lt; img＆gt;中使用SVG。标签。你必须使用＆lt; embed＆gt;这意味着你不能把它放在＆lt; a＆gt;中。或者＆lt; button＆gt;。即使使用嵌入，我也会看到像＃34;破碎的图像＆＃34; IE8中的图标。
在我写这篇文章的时候，我注意到了＃34;类似问题下的几个项目＆＃34;看起来很有希望。但是当我查看它们时，它们使用CSS规范中未提及的属性：opacity，filter：alpha和rgba。当我使用复杂的语言时，我更喜欢在另一个窗口中打开完整的语言规范，或者使用等效的死树版本（例如，O＆＃39; Reilly三文鱼书层叠样式表，最终版本指南，位于我桌旁的书架上。
所以我要求提出建议。如果共识是使用SVG，我会发布我的代码，看看人们是否可以告诉我我做错了什么。
答案 0 :(得分：1)
CSS＆＃34;不透明度＆＃34;财产完全有效。它是CSS3的一部分，并且在所有浏览器（*）中都受支持。
http://caniuse.com/css-opacity
或者你可以使用半透明的PNG，正如Alvaro所展示的那样。他们应该工作得很好。不确定你的尝试发生了什么，但你一定做错了。
答案 1 :(得分：0)
我不知道你对PNG有什么问题。到目前为止，Imo是最好和最简单的选择。根据我自己的经验，它们在所有浏览器中看起来都应该如此。
检查一下：http://jsfiddle.net/BDLYG/
(and here a code I need to add)
答案 2 :(得分：0)
如果你有大多数用户使用'现代'浏览器，我会说与SVG一起使用。如果你这样做，请在这里发帖，我很乐意提供帮助。
答案 3 :(得分：0)
非常感谢所有有用的答案。我目前正在使用CSS和PNG（通过PHP生成）的组合。我可以只使用CSS，但我决定在用户将鼠标悬停在按钮上时更改背景的不透明度 - 但保持文本不透明。改变整个事物的不透明度很容易，但（据我所知）不仅仅是背景。
我也尝试过SVG，它也可以正常工作，但它需要额外的计算，所以我选择了更简单（对我而言）的CSS和PHP方法。我已经对这两种语言感到满意了，只需要在CSS3中引入更新的东西，并且需要一个额外的函数调用来使alpha工作在PHP GD包生成的PNG中。