背景顏色的不透明度而不影響文本

在Web 開發領域，實現透明度通常對於增強視覺吸引力和網站元素的功能。常見的要求是對 div 背景套用透明度，同時保留所包含文字的不透明度。這可能會帶來挑戰，特別是在確保跨瀏覽器相容性方面。

rgba 解決方案

最有效且廣泛支持的解決方案是利用「RGBA」(紅、綠、藍、Alpha）屬性。這是一個例子：

.alpha60 {
  background-color: rgba(0, 0, 0, 0.6);
}

'rgba' 屬性指定背景顏色及其 Alpha 通道或透明度。在本例中，背景設定為黑色，不透明度為 60%。這種方法適用於大多數現代瀏覽器。

IE Fallbacks

為了實現跨瀏覽器相容性，包括舊版本的 Internet Explorer，需要額外的 CSS 規則：

.alpha60 {
  background-color: rgb(0, 0, 0);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
}

'rgb' 屬性設定 IE 的後備背景顏色，而 'filter' 和 '-ms-filter' 屬性分別在版本 5.5 到 7 和 8 中套用透明度。

IE 瀏覽器注意事項

為了確保透明度，必須在IE 的 CSS 後備。這可以確保即使 Alpha 通道支援不可用，背景顏色也保持透明。