文章目录
一、前言
互联网应用需要能够根据实事情况做出相应调整,例如主题置灰效果。比较简单的实施方案是在样式中添加滤镜效果,例如:把<html>
替换成<html style="filter:grayscale(1)">
即可。核心代码就是filter:grayscale(1)
,意思是「把当前元素及其后代元素设置成100%的灰度模式」。
如果需要兼容低版本浏览器,可以通过如下方式实现:
<html class="gray">
// 现代浏览器
.gray {
filter: grayscale(1);
}
// 远古浏览器
.gray {
-webkit-filter: grayscale(1); /* Old Chrome、Old Safari、Old Opera*/
filter: grayscale(1); /* 现代浏览器标准 */
filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); /* IE */
}
二、RN 中实现自定义主题色
鉴于RN不支持filter
设置滤镜属性。故需通过原生层面实现。