CSS圖片的灰色顯示效果
分享一段程式碼例項,它實現了讓圖片以灰色形式顯示的效果。
這裡並沒有考慮低版本的IE瀏覽器(以後也無需考慮)。
程式碼例項如下:
[HTML] 純文字檢視 複製程式碼執行程式碼<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style type="text/css"> .gray { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); filter: grayscale(100%); filter: gray; } </style> </head> <body> <img class="gray" src="mytest/demo/yinying.jpg"> </body> </html>
filter屬性可以參閱CSS filter屬性一章節。
相關文章
- 掀開圖片顯示介紹的css效果CSS
- 將圖片以灰色方式顯示的程式碼
- 三種讓網站圖片生成灰色效果的方法網站
- CSS圓形圖片效果CSS
- img圖片無法顯示利用onerror事件顯示替代圖片Error事件
- CSS文字環繞圖片效果CSS
- 載入網路圖片所顯示的轉圈效果及載入成功前與失敗後所顯示的圖示
- ImageView顯示網路上的圖片View
- win10網路圖示灰色怎麼解決_win10不顯示網路圖示灰色修復方法Win10
- 網頁圖片不能顯示 網頁圖片顯示不出來的解決辦法網頁
- CSS3圖片旋轉效果CSSS3
- CSS圖片邊框陰影效果CSS
- CSS3圖片拉近放大效果CSSS3
- 純CSS製作液晶屏的顯示效果CSS
- Java——圖片滾動顯示Java
- opencv圖片上如何顯示兩個小圖片OpenCV
- win7圖片只顯示圖示不顯示預覽圖解決方案Win7圖解
- JQuery滑鼠移到小圖顯示大圖效果的方法jQuery
- CSS點選隱藏和顯示div效果CSS
- CSS 控制 input 只顯示下劃線效果CSS
- CSS背景圖片作為連結效果CSS
- css實現文字和圖片居中效果CSS
- CSS滑鼠懸浮圖片動畫放大效果CSS動畫
- iOS設定tabbar不顯示文字,只顯示圖片iOStabBar
- 一個有意思的CSS圖片hover效果CSS
- JS控制圖片顯示的大小(圖片等比例縮放)JS
- 小程式button背景顯示圖片
- vue el-image 顯示圖片Vue
- 預載入顯示圖片的藝術
- 資料庫顯示圖片的問題資料庫
- iphone 將圖片處理成灰色(Gray)的iPhone
- css優化文字顯示效果程式碼例項CSS優化
- CSS3圖片上下動畫浮動效果CSSS3動畫
- CSS滑鼠懸浮圖片模糊切換效果CSS
- 使用CSS的clip-path實現圖片剪下效果CSS
- Android 開源圖片裁剪工具、圖片顯示工具分享Android
- iOS Swift 仿微信聊天圖片顯示iOSSwift
- 動態顯示資料庫圖片資料庫