http://www.w3.org/TR/css3-color/#transparency

例如說一個網頁有底圖，內有一個有設定底色的表格。可有辦法做到讓表格底色變成半透明混色（跟網頁底圖混色），但表格內的文字仍然是實心純色的呢？

直接把opacity屬性加到表格上的話，會讓整個表格內的東西通通都變成半透明，而且沒有辦法從表格內部調回不透明。迂迴的做法可以是把表格設為全透明底色，然後在原表格底下墊一層有顏色且半透明的東西。可是要怎麼才能讓"那層東西"的存在範圍僅限於表格的位置啊？

An old fashioned way is to use an alpha transparency image ([tt]png[/tt]) as background.

_________________
Netscape 9 | SillyDog701: Switch guide | Browser Archive | MozInfo701
MacCentre701 | AntBlog701
Don't steal music.

呃，這的確是個好辦法……還可以讓Opera也達到一樣的效果。用opacity的話Opera還要等9出來才有得用，改用png的話現在就可以了。IE6既不支援opacity也不支援png（IE7會有吧？），那就沒辦法啦。

總之非常感謝。

這也是我之前用opacity一直覺得很困擾的問題，因為半透明度一用，所有的子元素就全都會繼承到這個屬性，好像是一層遮罩，而非背景。為什麼W3C要這樣制定呢？這樣子這個opacity的用意到底是什麼呢？

還是說opacity其實可以設超過1的值？:P（別理我）

_________________
不努力的話，就會死在這裡，或是死在那裡。

剛才翻了一下CSS 3的文件，裡頭就用了mask這個字XD
看起來和IE的filter效果是一樣的
不能讓子元素變成不透明還真是麻煩 >"<

_________________
在靜謐的國度裡，擁抱微風－－抱風伴靜

這樣不知道行不行得通??

看來是沒用，畢竟「 body 」和「 body * 」是不同層次的，
所以就算寫 !important 也沒意義。

（而且我覺得 opacity 很容易吃太多 CPU ，除非半透明的那部分不打算讓它移動。）

_________________
【Firefox 有問題請先看這裡】
回覆文章的建議
萬用自我檢測除錯大法 for Firefox
完全備份大法 for Firefox
重建 Firefox 的設定
乾淨升級 Firefox
（本帳號停用中）

用在 body 是一定沒有用的，應該要試 body 裏面的 node 才行。

I would suggest my old fashioned method aforementioned.

Otherwise, use two DIVs (or layers), and position one on top of the other one. Then you can specify one layer (DIV) as translucent background.

_________________
Netscape 9 | SillyDog701: Switch guide | Browser Archive | MozInfo701
MacCentre701 | AntBlog701
Don't steal music.

不過我用在 body 或裡面的元素都差不多的樣子，
不同人的電腦會有差別？

不過我在想，能讓 opacity 值超過 1 ，
應該有辦法讓子元素變得更 opacity 吧。
比如說照下面寫的，
然後試著個別改變 body 和 body * 的值：

可以發現 body * 的 opacity 是 "0.8*0.8" ，
所以讓它 "0.8*X=1, X=1.25" 這樣子，
說不定就能使內文比較易見了，
可是我覺得這樣會有另一個問題，
因為底下的 body * 仍是一整塊的，
所以大概就是會看到一塊一塊 opacity 為 1 的區塊吧。
也許只能考慮用圖片再配上 IE Only 的語法試試了。

（另一個做法就是寫個空元素區塊放在字下面試試，不過這樣子會有 position 與 z-index 的問題要解決。）

_________________
【Firefox 有問題請先看這裡】
回覆文章的建議
萬用自我檢測除錯大法 for Firefox
完全備份大法 for Firefox
重建 Firefox 的設定
乾淨升級 Firefox
（本帳號停用中）

其實我沒有試過。我的意思只是，body 的情況比較特別，和其他 element 處理的情形不同。

另外你說的 1.25 這種方法應該是行不通? 因為 opacity 的值必須在 0.0 與 1.0 之間。

超大量alpha PNG之背景半透明使用範例。
http://browsershots.org/website/853694/

IE6不支援alpha PNG，所以直接用CSS hack把背景圖省略了。其他的看起來都大同小異，除了Konqueror缺字（該是抓圖電腦的設定問題）跟Safari的PNG色不對……這是怎麼一回事？

It could due to the service.

Otherwise, try not to embed colour profiles. Use standard one.

_________________
Netscape 9 | SillyDog701: Switch guide | Browser Archive | MozInfo701
MacCentre701 | AntBlog701
Don't steal music.

我覺得Anthony這個方法很好。我也是看了新版的TiddlyWiki，才知道原來可以用兩層div疊在一起做陰影效果:)

_________________
不努力的話，就會死在這裡，或是死在那裡。