CSS3 opacity 屬性用來設定網頁元素的不透明效果
相信許多人都想要透過 CSS 的不透明度屬性來調整網頁元素的透明度，讓網頁裡面的小玩意兒呈現有點半透明的感覺，這種感覺有什麼好處？就是整體的立體感很容易展現出來，多層次的視覺感覺也能更清楚的表達。
CSS3 內建的 opacity 屬性就可以調整某個元素的＂不透明度＂，調整只要透過數字的範圍就能做到，範圍是自 0.0 開始到 1.0 這個區間，調整成完全透明就用 opacity:0.0，要調整成完全不透明就用 opacity:1.0，數字越大，越不透明，所以才說 opacity 是調整不透明度，而不是調整透明度，不過在某些角度來看也是同樣的意思啦！
那 CSS3 opacity 屬性會不會很困難呢？其實一點都不困難，甚至還有點簡單好上手，這裡稍微寫一個簡單的範例給大家看就知道了。
Wibibi 網站上有比較詳細的不透明度調整，請自己研究這篇：CSS3 opacity 屬性 (透明效果)
有了不透明度的調整概念，就可以很輕鬆的用來調整網頁中的許多元素，例如 DIV 區塊或是單一張圖片、背景圖片、外出照片 .... 效果很不賴唷！
CSS3 內建的 opacity 屬性就可以調整某個元素的＂不透明度＂，調整只要透過數字的範圍就能做到，範圍是自 0.0 開始到 1.0 這個區間，調整成完全透明就用 opacity:0.0，要調整成完全不透明就用 opacity:1.0，數字越大，越不透明，所以才說 opacity 是調整不透明度，而不是調整透明度，不過在某些角度來看也是同樣的意思啦！
那 CSS3 opacity 屬性會不會很困難呢？其實一點都不困難，甚至還有點簡單好上手，這裡稍微寫一個簡單的範例給大家看就知道了。
<div style="padding:10px;background-color:green;opacity:0.5;">
用 CSS3 opacity 屬性的透明度處理為半透明效果
</div>
這個範例就是一個簡單的半透明效果，怎麼說是半透明呢？因為 opacity 的屬性值為 0.5，剛好介於 0.0~1.0 之間，這就是半透明的效果囉！想要再透明一點怎麼設定？就把數字調整到比 0.5 小就可以啦！反之，要再不透明一點，就把數字調到比 0.5 更大些，很簡單吧！？用 CSS3 opacity 屬性的透明度處理為半透明效果
</div>
Wibibi 網站上有比較詳細的不透明度調整，請自己研究這篇：CSS3 opacity 屬性 (透明效果)
有了不透明度的調整概念，就可以很輕鬆的用來調整網頁中的許多元素，例如 DIV 區塊或是單一張圖片、背景圖片、外出照片 .... 效果很不賴唷！