css 中的 opacity 屬性用于設(shè)置元素的透明度,范圍從 0(完全透明)到 1(完全不透明)。它可用于創(chuàng)建淡入淡出效果、懸停效果、疊加層、圖像效果和文本效果。所有現(xiàn)代瀏覽器都支持 opacity,而較舊的瀏覽器可以使用 filter 屬性作為替代。
CSS 中 opacity 的作用
CSS 中的 opacity 屬性用于設(shè)置元素的透明度,范圍從 0 到 1:
0: 完全透明
1: 完全不透明
如何在 CSS 中使用 opacity
opacity 屬性可以通過以下方式應(yīng)用于元素:
<code class="<a style='color:#f60; text-decoration:underline;' href=" https: target="_blank">css">element {
opacity: value;
}</code>
登錄后復(fù)制
其中 value 是 0 到 1 之間的數(shù)字,表示元素的透明度。
opacity 的用途
opacity 屬性在 CSS 中有廣泛的應(yīng)用,包括:
淡入或淡出效果: 通過逐漸改變 opacity 值,可以創(chuàng)建淡入或淡出效果。
懸停效果: 將 opacity 設(shè)置在較低的值上,可以在懸停時使元素變透明。
疊加層: 使用 opacity 可以創(chuàng)建半透明的疊加層,以顯示其他元素的背景。
圖像效果: opacity 可用于創(chuàng)建褪色、重疊或類似水印的效果。
文本效果: 將文本的 opacity 設(shè)置為較低的值,可以創(chuàng)建微妙的陰影或強(qiáng)調(diào)效果。
瀏覽器兼容性
opacity 屬性在所有現(xiàn)代瀏覽器中都得到支持。然而,較舊的瀏覽器可能需要使用 filter 屬性作為替代。






