我正在使用圖像作爲菜單背景的項目。我在我的CSS樣式表中定義了類，這些類指定了項目是否被「選中」時的外觀，這意味着用戶不在每個項目鏈接的頁面上。設置CSS中不透明度的div內元素的不透明度？
我把它與圖像頂部的一個div結構在一起，樣式應用於它使它具有半透明的白色背景，所以看起來像圖像的那部分被突出顯示。每個半透明div還包含構成鏈接的文本，顏色設置爲白色。我希望div能夠保持不透明，而文本仍然是「1」的不透明度。
我試過類似問題中討論的方法（CSS - Apply Opacity to Element but NOT To Text Within The Element），但該方法似乎不適用於我。
如果你想看看它，我已經發布了JSFiddle鏈接的代碼位http://jsfiddle.net/Cwca22/uG5y8/。
在此先感謝您的幫助。
如果你正在尋找一個純CSS的解決方案，並願意改變你的標記一點，看看這個例子：
它把每個「鏈接」作爲單獨的背景和文本元素的組合，然後將它們定位在彼此之上，以便只有背景div使用透明度。
如果我在商業項目中使用您的代碼，可以嗎？我根據需要對其進行了一些修改，但我只是想確保它可以事先使用。 – 2012-01-02 23:20:14
沒問題，很高興有幫助！ – justis 2012-01-03 03:00:53
好吧，太棒了，謝謝！ – 2012-01-03 04:26:08
老問題沒有任何標準的解決方案呢！這在今天的CSS中是不可能的。我知道的唯一解決方案是使用JS。使用JS，您可以捕獲受影響的H＃的鼠標移動並創建/定位元素。這個新的'over'元素不應該是不透明度爲0.2的DIV的孩子。
好吧，我可能不得不嘗試一下，謝謝。我很驚訝沒有定義任何解決這些問題的方法！ – 2011-12-22 19:15:53
是的，認真。我相信這個問題一直存在於CSS2正在設計之中。零標準的跨瀏覽器方式來實現這一目標！ – techfoobar 2011-12-22 19:17:53
如果我正確地理解了你，你希望div的背景顏色部分透明以顯示圖像，但保持文本不透明？這很簡單：3
<div style="background-color: rgba(255,255,255,0.5);">Text</div>
如果你想爲瀏覽器不允許這種格式提供支持，那麼你需要：
<div style="background: #ffffff; background: rgba(255,255,255,0.5);">Text</div>
一次我寫了的jsfiddle像這樣的問題。這裏是http://jsfiddle.net/A53Py/5/
創建一個相同級別的元素，它絕對地位於元素後面，沒有不透明性。無需告訴它的跨瀏覽器。
希望它可以幫助
感謝所有對我的問題Kolink，Nacho，techfoobar和jblasco的解答。現在都很好，再次感謝。 ; ^） – 2012-01-02 18:14:28