DIV CSS鼠標移動懸停在圖片上圖片變色或半透明變化效果實現，CSS鼠標懸停圖片上圖片變灰、圖片變色、圖片半透明
一、DIVCSS5介紹與說明： - TOP
看到網頁中的圖片當鼠標移動到圖片上時（鼠標懸停在圖片上）圖片變灰，看似變色變灰效果，實際是圖片被CSS設置為半透明樣式。
二、關鍵CSS代碼： - TOP
a:hover img{filter:alpha(Opacity=80);-moz-opacity:0.8;opacity: 0.8;}
此CSS代碼作用，設置鼠標移動到A超鏈接時，超鏈接內圖片（img）呈現半透明顯示80%效果。
解釋：
filter 設置平台IE半透明效果樣式，值1-100，值越小越透明，設置IE8以前的透明使用
opacity 設置IE半透明效果樣式，值0.1-1，值越小越透明，設置IE8以后版本的透明使用
-moz-opacity 對非IE瀏覽器設置，比如火狐，語法與IE相同
此設置CSS樣式opacity、filter在IE6中不支持，因為現在IE6版本占有急劇下滑，所以一般不考慮IE6對此CSS的支持。
三、鼠標移動到圖片變色，圖片半透明實例 - TOP
實例案例描述：設置兩個DIV盒子，兩個盒子分別放入一張圖，通過對其設置鼠標懸停(:hover)時圖片半透明為80%和70%，觀察其效果。
1、關鍵CSS代碼
.div1,.div2{ width:500px; margin:20px auto} .div1 a:hover img{filter:alpha(Opacity=80);-moz-opacity:0.8;opacity: 0.8} .div2 a:hover img{filter:alpha(Opacity=70);-moz-opacity:0.7;opacity: 0.7}
這里設置了對DIV對象盒子里的超鏈接內圖片設置hover偽類半透明效果。