使用CSS將圖片轉換成黑白(灰色、置灰)

CSS3 greyscale 濾鏡實現

.gray { 
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    
    filter: grayscale(100%);
	
    filter: gray;
}
<img src="mm1.jpg" />
<img src="mm1.jpg" class="gray" />
複製代碼

能夠看到相似文章一開始展現的黑白對比效果圖。