文件名称:CSS-filter-Demo:微信小程序 CSS filter(滤镜)的使用示例
文件大小:1.1MB
文件格式:ZIP
更新时间:2024-05-28 17:08:22
JavaScript
前言 之前在看七月老师的视频的时候,看到了有一个样式是-webkit-filter,不知道是什么,于是查了一下,原来是滤镜吖。但是在微信小程序里使用的时候,下面一直飘红线,再仔细查了一下,原来是在Chrome, Safari, Opera中使用 -webkit-filter,而微信小程序里使用的话,使用filter就可以了。一时间好奇了下,就多试了几个函数,以下是详细的笔记 定义 filter 属性定义了元素(通常是)的可视效果(例如:模糊与饱和度)。 分类 none 默认值,没有效果。 blur() 高斯模糊 brightness() 亮度 contrast() 对比度 drop-shadow() 阴影 grayscale() 灰度 hue-rotate() 色相旋转 invert() 反色 opacity() 透明度 saturate() 饱和度 sepia() 复古色 ur
【文件预览】:
CSS-filter-Demo-master
----project.config.json(537B)
----common()
--------lib()
----pages()
--------sepia()
--------grayscale()
--------drop-shadow()
--------url()
--------invert()
--------contrast()
--------webkit-filter.wxml(317B)
--------blur()
--------webkit-filter.wxss(272B)
--------brightness()
--------hue-rotate()
--------webkit-filter.json(2B)
--------composition()
--------saturate()
--------opacity()
--------webkit-filter.js(470B)
----images()
--------drop-shadow.jpg(18KB)
--------invert.jpg(44KB)
--------blur.jpg(46KB)
--------sepia.JPG(25KB)
--------url.jpg(274KB)
--------opacity.jpg(391KB)
--------composition.jpg(117KB)
--------grayscale.jpeg(64KB)
--------saturate.jpg(47KB)
--------filters.svg(297B)
--------brightness.jpg(42KB)
--------hue-rotate.jpg(54KB)
--------contrast.jpg(14KB)
----app.js(46B)
----README.md(7KB)
----datas()
--------datas.js(1KB)
----app.json(562B)
----app.wxss(1KB)