CSS設定圖片變灰色

       在最近工作中，開發過程中需要設定一個圖片變為灰色，剛開始我以為是更換圖片，可是做了一段時間發現CSS就可以設定圖片顏色變回灰色。具體的代碼如下：
圖片如下：

具體的實現由兩種方法：一個是CSS3的濾鏡功能。具體代碼如下：

<span style="font-size:18px;">.gray { 
 -webkit-filter: grayscale(100%);




 -moz-filter: grayscale(100%);
 -ms-filter: grayscale(100%);
 -o-filter: grayscale(100%); 




 filter: grayscale(100%); 	 
filter: gray; }</span>

    只要把上面代碼拷過去，設定成你想修改的圖片樣式就可以了。例如

<img src="1.jpg" /> <img src="1.jpg" class="gray" />