兼容性:这个东西说多了也没意思,像HTML5和CSS3这种兼容性时刻变化的东东,我们最好在自己支持的设备上实验,不支持,就在想办法呗,这个东西就是为了方便和好玩

所有属性:

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; //复原

从CSS实现正片叠底看=>混合模式mix-blend-mode的更多相关文章

  1. CSS 奇技淫巧 | 妙用混合模式实现文字镂空波浪效果

    本文将介绍一个小技巧,通过混合模式 mix-blend-mode 巧妙的实现文字的镂空波浪效果. 起因 一日,一群友私聊问我.如何使用 CSS 实现下述效果,一个文字的波浪效果: 我当时想都没想,就回 ...

  2. css mix-blend-mode 颜色滤镜混合模式

    CSS3混合模式种类 在CSS3混合模式中,目前仅有16种:normal,multiply,screen,overlay,darken,lighten,color-dodge,color-burn,h ...

  3. Lodop打印控件传入css样式、看是否传入正确样式

    Lodop中可以传入页面存在的css样式,也可以是拼接后的新样式,例如本博客的其他博文:Lodop打印如何隐藏table某一列 需要打印的页面,样式不一定都是行内样式,style样式单独写在页面上,或 ...

  4. css (具体代码看笔记本)

    参考:https://www.cnblogs.com/liwenzhou/p/7999532.html  1. CSS语法   选择器 {属性1:值1;...;}  2. CSS导入方式   1. 行 ...

  5. 解决两个相邻的span,或者input和button中间有间隙,在css中还看不到

    <span id="time"></span><span id="second"></span> <inp ...

  6. 探究 CSS 混合模式\滤镜导致 CSS 3D 失效问题

    今天在写一个小的 CSS Demo,一个关于 3d 球的旋转动画,关于 CSS 3D,少不了会使用下面这几个属性: { transform-style: preserve-3d; perspectiv ...

  7. 看《css知多少》的一些总结

    问题 1.有些浏览器不完全支持css3,现在可以用哪个工具去检测浏览器是否支持,以及支持哪些项? modernizr:检测浏览器对HTML5和CSS3特性(至于modernizr的介绍,可以看我另外一 ...

  8. 神奇的 CSS,让文字智能适配背景颜色

    最近几天,有好几个同学都问了同样一个问题. 页面上有一段文本,能否实现这段文本在不同背景色下展示不同的颜色?也就是俗称的智能变色.像是下面这样: 文本在黑色底色上表现为白色,在白色底色上表现为黑色.看 ...

  9. Atitti 图像处理 图像混合 图像叠加 blend 原理与实现

    Atitti 图像处理 图像混合 图像叠加 blend 原理与实现 混合模式 编辑 本词条缺少信息栏,补充相关内容使词条更完整,还能快速升级,赶紧来编辑吧! 混合模式是图像处理技术中的一个技术名词,不 ...

随机推荐

  1. 获取bing.com的图片并在gnome3中设置自动切换

    发现 bing.com 上的图片很好看,因此打算每天把 bing.com 的图片下载下来,用作桌面. 需要做的是两个部分,爬取图片到目录和设置目录图片为桌面背景并可以自动切换. 第一部分,下载图片,使 ...

  2. iOS-开发者相关的几种证书

    目录 引言 写在前面 一App IDbundle identifier 二设备Device 三开发证书Certificates 证书的概念 数字证书的概念 iOS开发证书 iOS开发证书的根证书 申请 ...

  3. 浅谈HTML5单页面架构(一)——requirejs + angular + angular-route

    心血来潮,打算结合实际开发的经验,浅谈一下HTML5单页面App或网页的架构. 众所周知,现在移动Webapp越来越多,例如天猫.京东.国美这些都是很好的例子.而在Webapp中,又要数单页面架构体验 ...

  4. 搭建LNAMP环境(三)- 源码安装Apache2.4

    上一篇:搭建LNAMP环境(二)- 源码安装Nginx1.10 1.yum安装编译apache需要的包(如果已经安装,可跳过此步骤) yum -y install pcre pcre-devel zl ...

  5. 【Win 10应用开发】实现全屏播放的方法

    有人会问,以前的MediaElement控件不是有现成的一排操作按钮吗?而且可以直接进入全屏播放.是的,我们知道,以往的Store App都是在全屏模式下运行的,只要MediaElement控件填满整 ...

  6. PHP浅复制与深复制

    原文链接:http://www.orlion.ga/731/ php用clone复制对象有一个问题,下面用代码来说明问题: class Foo{ public $bar; public $name; ...

  7. 如何完全卸载OneDrive (Windows 10 64bit)

    原文参考 http://lifehacker.com/how-to-completely-uninstall-onedrive-in-windows-10-1725363532 To complete ...

  8. Java基本语法练习

    1.编写程序,求100以内的全部素数. 实验源码: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 public class F ...

  9. 小菜学习设计模式(一)—模板方法(Template)模式

    前言 设计模式目录: 小菜学习设计模式(一)—模板方法(Template)模式 小菜学习设计模式(二)—单例(Singleton)模式 小菜学习设计模式(三)—工厂方法(Factory Method) ...

  10. php上传功能集后缀名判断和随机命名

    form.php <html> <head> <meta http-equiv="content-type" content="text/h ...