溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要介紹css如何實現圖片半透明效果，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！
css實現圖片半透明效果的方法：可以通過opacity屬性來進行設置，如【style="-moz-opacity:0.5";】。opacity屬性用來設置元素的不透明級別，語法為【opacity:value|inherit;】。
屬性介紹：
opacity 屬性設置元素的不透明級別。
語法：
opacity: value|inherit;
屬性值：
value 規定不透明度。從 0.0 （完全透明）到 1.0（完全不透明）。
inherit 應該從父元素繼承 opacity 屬性的值。
實現代碼如下：
這個效果在IE和Mozilla瀏覽器上都可以工作，代碼如下
<img alt="powerbookg4.jpg" src="archives/images/powerbookg4.jpg" width="250" height="60" style="-moz-opacity:0.5; filter:alpha(opacity=50);cursor:hand;" onmouseover="this.style.MozOpacity=1; this.filters.alpha.opacity=100" onmouseout="this.style.MozOpacity=0.5; this.filters.alpha.opacity=50">
在IE中需要通過"filter"來定義透明度"opacity"，而在Mozilla中是可以直接解析"opacity"，所以如果要使得這個效果在兩種瀏覽器中都得到支持，需要把兩種設定都加進去。
針對IE的設定：this.filters.alpha.opacity=50；針對Mozilla的設定：this.style.MozOpacity=0.5。
以上是“css如何實現圖片半透明效果”這篇文章的所有內容，感謝各位的閱讀！希望分享的內容對大家有幫助，更多相關知識，歡迎關注億速云行業資訊頻道！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
