首頁 >web前端 >css教學 >如何在所有瀏覽器中使 Div 的背景透明,同時保持文字不透明?

如何在所有瀏覽器中使 Div 的背景透明,同時保持文字不透明?

Patricia Arquette
Patricia Arquette原創
2024-12-23 14:10:11962瀏覽

How Can I Make a Div's Background Transparent While Keeping Text Opaque in All Browsers?

背景顏色的不透明度效果而不影響文字

在保持不透明文字的同時實現div 背景的透明度需要一個跨瀏覽器解決方案,該解決方案位址Internet Explorer 6。

無需外部即可完成此操作庫:

  • 利用 rgba: RGBa 值除了顏色值之外還允許指定透明度(不透明度)。
.alpha60 {
    background-color: rgba(0, 0, 0, 0.6);
}
  • 抵消 IE 行為: Internet Explorer 需要額外的過濾器來支援 RGBa透明度。
.alpha60 {
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
}
  • 處理 IE 背景繼承: 要防止 IE 中的子元素繼承不透明度,請聲明背景:透明。最好使用條件註釋來完成此操作。

以上是如何在所有瀏覽器中使 Div 的背景透明,同時保持文字不透明?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn