我是靠谱客的博主 笑点低大象,这篇文章主要介绍图片去色css代码怎么写,现在分享给大家,希望可以做个参考。

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

图片去色css代码怎么写

我们可以使用filter滤镜属性来写出图片去色,filter 属性定义了元素(通常是<img>)的可视效果(例如:模糊与饱和度)。

当属性值为grayscale时,将图像转换为灰度图像。值定义转换的比例。值为100%则完全转为灰度图像,值为0%图像无变化。值在0%到100%之间,则是效果的线性乘子。若未设置,值默认是0;

下面我们通过示例来看一下:

复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <style> .img1 { filter: grayscale(100%); } </style> <img src="1118.02.png" class="img1"> <img src="1118.02.png" class="img2"> </body> </html>
登录后复制

输出结果:

27.png

(学习视频分享:css视频教程)

以上就是图片去色css代码怎么写的详细内容,更多请关注靠谱客其它相关文章!

最后

以上就是笑点低大象最近收集整理的关于图片去色css代码怎么写的全部内容,更多相关图片去色css代码怎么写内容请搜索靠谱客的其他文章。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(121)

评论列表共有 0 条评论

立即
投稿
返回
顶部