使用css秒过<大家来找茬>

来源:互联网 时间:1970-01-01

相同的内容都是灰色,不相同的内容凸显出来,接下来你要做的就是静静地找(zhuang)茬(13)。

所以重点全在最后的css代码 -webkit-filter: invert(100%) opacity(50%);。

这行代码的作用是给应用到的元素添加过滤器,过滤内容为颜色反转 (255-c1),透明度变为50%,则为两种颜色的平均值 (c1 + c2) / 2。所以在某点上,我们最终看到的颜色值为 ((255-c1) + c2)/2。于是相同颜色值的点将变成rgb(127.5,127.5,127.5)。这就是为什么大部分区域为灰色了。

注意:Firefox 34及更老版本不支持,当你可以添加兼容代码:

filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='invert' color-interpolation-filters='srgb'><feColorMatrix color-interpolation-filters='srgb' in='SourceGraphic' type='matrix' values='-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 0 0.5'/></filter></svg>#invert"); 为保证效果,请在Chrome中打开


相关阅读:
Top