摘要:在线编辑属性描述了元素的内容应该与元素的直系父元素的内容和元素的背景如何混合。正常正片叠底滤色叠加变暗变亮颜色减淡颜色加深强光柔光差值排除色相饱和度颜色亮度初始继承复原在线编辑参考资料原文地址
在线编辑demo
属性描述了元素的内容应该与元素的直系父元素的内容和元素的背景如何混合。mix-blend-mode: normal; //正常mix-blend-mode: multiply; //正片叠底
mix-blend-mode: screen; //滤色
mix-blend-mode: overlay; //叠加
mix-blend-mode: darken; //变暗
mix-blend-mode: lighten; //变亮
mix-blend-mode: color-dodge; //颜色减淡
mix-blend-mode: color-burn; //颜色加深
mix-blend-mode: hard-light; //强光
mix-blend-mode: soft-light; //柔光
mix-blend-mode: difference; //差值
mix-blend-mode: exclusion; //排除
mix-blend-mode: hue; //色相
mix-blend-mode: saturation; //饱和度
mix-blend-mode: color; //颜色
mix-blend-mode: luminosity; //亮度
mix-blend-mode: initial; //初始
mix-blend-mode: inherit; //继承
mix-blend-mode: unset; //复原
在线编辑demo
参考资料:
MDN: mix-blend-mode
原文地址
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/52325.html
摘要:在线编辑属性描述了元素的内容应该与元素的直系父元素的内容和元素的背景如何混合。正常正片叠底滤色叠加变暗变亮颜色减淡颜色加深强光柔光差值排除色相饱和度颜色亮度初始继承复原在线编辑参考资料原文地址 showImg(https://segmentfault.com/img/remote/1460000014766135); 在线编辑demo 属性描述了元素的内容应该与元素的直系父元素的内容...
摘要:属性描述了元素的内容应该与元素的直系父元素的内容和元素的背景如何混合。正常正片叠底滤色叠加变暗变亮颜色减淡颜色加深强光柔光差值排除色相饱和度颜色亮度初始继承复原 属性描述了元素的内容应该与元素的直系父元素的内容和元素的背景如何混合。 mix-blend-mode: normal; /...
摘要:但该盒不建立新的层叠上下文,除非是根元素。以上是基于的层叠上下文介绍。同级情况下,按照二者在源代码中的顺序,居后的又重新占领高地了。现在我们看以下源代码这个时候,以视口为包含块进行定位和大小计算,将会铺满整个屏幕。 前言:关于层叠上下文,笔者还没有去阅读更详细的 W3C 规范来了解更本质的原理(表打我,等我校招拿到 offer 了我就读好伐 T_T)。一直听说 CSS3 里的层叠上下文...
摘要:在网上看到了有如相机功能的实现比较好看的图片样式,自己也想弄下,在这里记录下效果图相关属性正常正片叠底滤色叠加变暗变亮颜色减淡颜色加深强光柔光差值排除色相饱和度颜色 在网上看到了有如相机功能的mix-blend-mode实现比较好看的图片样式,自己也想弄下,在这里记录下 1.效果图 showImg(https://segmentfault.com/img/bVblsM0?w=726&...
阅读 3922·2021-11-16 11:44
阅读 5103·2021-10-09 09:54
阅读 1983·2019-08-30 15:44
阅读 1641·2019-08-29 17:22
阅读 2717·2019-08-29 14:11
阅读 3358·2019-08-26 13:25
阅读 2292·2019-08-26 11:55
阅读 1561·2019-08-26 10:37