中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

css3 greyscale實現去色 css3實現圖片或頁面變為黑白效果

發布時間:2020-07-06 13:17:19 來源:網絡 閱讀:1866 作者:鵬仔先生 欄目:web開發
今天幫朋友看一效果,看到了手標滑過圖片變為彩色的效果,很簡單又兼容各大瀏覽器的,無非是準備兩張圖,一張黑白,一張彩色,滑過切換背景圖或直接切換圖片方法,當然,誰也不想這么復雜操作。

下面用css3安排下:

給標簽加上下方css代碼,即可變為黑白,也就是去色

filter: grayscale(100%);
filter: gray;

安排下兼容寫法


    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
如果要做滑過變為彩色,舉個列子,網站頁面一排排圖片,均加了上方代碼,變為黑白的,然后滑過讓恢復顏色,如下方代碼

初始代碼

img{
    filter: grayscale(100%);
    filter: gray;
}

滑過代碼

img :hover{
    filter: grayscale(0);
    filter: none;
}

整個網站頁面變為黑白色,直接加給 html 即可安排

本文詳情 http://www.sharedblog.cn/?post=186

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

吉安市| 扶沟县| 泽州县| 株洲县| 大渡口区| 广饶县| 都兰县| 信宜市| 镇巴县| 望都县| 当阳市| 延川县| 克山县| 安丘市| 武川县| 嘉定区| 江安县| 静乐县| 谢通门县| 抚州市| 宣化县| 绥中县| 华蓥市| 昌黎县| 邳州市| 德阳市| 南通市| 泗阳县| 台南县| 开封县| 微博| 象州县| 昌平区| 龙山县| 航空| 长葛市| 健康| 桐庐县| 崇礼县| 凤阳县| 玉门市|