1. 一种是用js判断兼容性

    // JS
    if ("CSS" in window && "supports" in window.CSS) {
    var support = window.CSS.supports("mix-blend-mode","difference");
    support = support?"mix-blend-mode":"no-mix-blend-mode";
    document.documentElement.className += support;
    } // CSS
    h1 { color: #000; }
    .mix-blend-mode body {
    background-image: linear-gradient(90deg,#fff 49.9%,#000 50%);
    } .mix-blend-mode h1 {
    color: #fff;
    mix-blend-mode: difference;
    }
  2. 用CSS中的@supports

    @supports (mix-blend-mode: difference) {
    body {
    background-image: linear-gradient(90deg,#fff 49.9%,#000 50%)
    }
    h1 {
    color: #fff;
    mix-blend-mode: difference;
    }
    }

CSS属性兼容写法的更多相关文章

  1. IE浏览器兼容问题(上)——html和css的兼容写法

    用户使用的浏览器五花八门,我们要保证每一种浏览器都能兼容我们的代码,不能要求用户去改变浏览器,那么就得在我们的代码上下功夫.此时我们要用到hack. HACK就是针对不同的浏览器写不同的HTML.CS ...

  2. css属性兼容主流浏览器

    目前,对于网页中一些浏览器兼容性问题,可以使用css hack(css 招数)和浏览器Bug修复的方式解决. 名词解释: css Hack:针对特定浏览器编写冗余代码,这是一种欺骗浏览器的行为,预示着 ...

  3. CSS半透明兼容写法

    filter: Alpha(opacity=10); -moz-opacity:0.1; opacity:0.1; 例如: background:#A5CD40; filter: Alpha(opac ...

  4. 浏览器 CSS 兼容写法的测试总结

    做前端最讨厌的就是 IE6,7,8,虽然被淘汰的浏览器,但是在中国用户仍然很多,不可能像国外网站一样直接就不管它了,这样会流失很多流量啊. 现在有了IE9,IE10还好些,几乎和 Chrome,Fir ...

  5. css 背景色渐变兼容写法

    最近在项目中,有很多地方都用到了线性渐变,比如:表单提交按钮的背景,数据展示的标题背景等等,按照以前的做法是切 1px 图片然后 repeat-x.下面我将介绍如何用 css 来完成该效果. css3 ...

  6. 【css】css 背景色渐变兼容写法

    最近在项目中,有很多地方都用到了线性渐变,比如:表单提交按钮的背景,数据展示的标题背景等等,按照以前的做法是切 1px 图片然后 repeat-x.下面我将介绍如何用 css 来完成该效果. css3 ...

  7. CSS三角的写法(兼容IE6)

    目录 简介 优点 原理 1. 先创建一个div 2. 然后给div设定边框. 3. 给div的四个边框都设置不同的颜色 4. 把宽度和高度都变成0 5. 其余角为透明 6. 兼容IE6浏览器 造成这样 ...

  8. (转)css 背景色渐变兼容写法

    css3:linear-gradient 比如:黑色渐变到白色,代码如下: .gradient{ background: -moz-linear-gradient(top, #000000 0%, # ...

  9. css复合属性的写法

    # 复合属性也称为 "shortcut" property (快捷属性),它作用是为了简化代码,提高页面运行的效率. # 下面的内容会介绍 2 个比较常用的复合属性 "f ...

随机推荐

  1. Java 找出四位数的所有吸血鬼数字 基础代码实例

    /**  * 找出四位数的所有吸血鬼数字  * 吸血鬼数字是指位数为偶数的数字,可以由一对数字相乘而得到,而这对数字各包含乘积的一半位数的数字,其中从最初的数字中选取的数字可以任意排序.  * 以两个 ...

  2. 记录一次Oracle注入绕waf

    这个注入挺特殊的,是ip头注入.我们进行简单的探测: 首先正常发起一次请求,我们发现content-type是76 探测注入我习惯性的一个单引号: 一个单引号我发现长度还是76 我开始尝试单引号,双引 ...

  3. Java之函数式接口

    函数式接口 概述:接口中只有一个抽象方法 下面介绍的可能很抽象,理解不了,至少在我看来单独的这几个借口是没有用的,跟最下面说的 Stream流一起用才会有效果 函数式接口,即适用于函数式编程场景的接口 ...

  4. bzoj2253 纸箱堆叠

    题目链接 题意 求三元组的严格上升子序列 思路 先考虑暴力\(dp\)一下 for(int i = 1;i <= n;++i) for(int j = 1;j < i;++j) if(x[ ...

  5. makefile :=和+=

    经常有人分不清= .:=和+=的区别  这里我总结下做下详细的分析: 首先你得清楚makefile的运行环境,因为我是linux系统,那么我得运行环境是shell 在Linux的shell里,shel ...

  6. 网页三剑客之JS

    1.javascrapt介绍 js概述 JavaScript是运行在浏览器端的脚步语言,JavaScript主要解决的是前端与用户交互的问题,包括使用交互与数据交互. JavaScript是浏览器解释 ...

  7. cacti报警邮件的设置

    众所周知,用Linux系统自带的sendmail发送邮件是有限制的,可能对有些邮箱无法正常发送,导致报警邮件不能够及时发送到,因此就可能会产生不必要的麻烦!对此,我们可以用其他方法来发送邮件,就是在c ...

  8. MongoDB 3.6.9 集群搭建 - 切片+副本集

    1. 环境准备 在Mongo的官网下载Linux版本安装包,然后解压到对应的目录下:由于资源有限,我们采用Replica Sets + Sharding方式来配置高可用.结构图如下所示: 这里我说明下 ...

  9. uploadPreview上传图片前预览图片

    uploadPreview.js是一款图片上传前的预览插件.谷歌.火狐.IE都可以兼容,但是不支持safari. 相关的html代码: <!DOCTYPE html PUBLIC "- ...

  10. ado.net 使用:ExecuteReader 无法获取输出参数

    解决方法: 要获取到输出参数.需要连接关闭之后才行. 一般都是用using把打开数据库连接的reader包起来