css - Firefox 和 IE 的不同 div 背景图像

Question

我制作了一个clip-path 并在背景中使用了一个.gif 让它看起来很棒。但是，我遇到了一个问题:Firefox 和 IE 不支持 clip-path。相反，他们只是以非常丑陋的方式显示背景图像。有什么办法可以为 Firefox 和 IE 用户设置不同的背景图片吗？

CSS:

.thisdiv {
  width: 280px;
  height: 280px;
  background-image: url("image.gif");
  -webkit-clip-path: polygon(3% 3%, 43% 3%, 54% 4%, 61% 5%, 67% 7%, 74% 10%, 79% 13%, 84% 17%, 88% 22%, 91% 27%, 94% 34%, 96% 41%, 97% 48%, 97% 56%, 95% 64%, 93% 71%, 90% 76%, 86% 81%, 82% 85%, 77% 89%, 60% 60%, 78% 50%, 28% 22%, 28% 78%, 47% 67%, 63% 94%, 56% 96%, 48% 97%, 3% 97%);
  clip-path: polygon(3% 3%, 43% 3%, 54% 4%, 61% 5%, 67% 7%, 74% 10%, 79% 13%, 84% 17%, 88% 22%, 91% 27%, 94% 34%, 96% 41%, 97% 48%, 97% 56%, 95% 64%, 93% 71%, 90% 76%, 86% 81%, 82% 85%, 77% 89%, 60% 60%, 78% 50%, 28% 22%, 28% 78%, 47% 67%, 63% 94%, 56% 96%, 48% 97%, 3% 97%);
  background-size: cover;
  background-blend-mode: screen;
}

Answer 1

不幸的是，clip-path 并没有得到广泛支持，仅 yet

因此，您最好的选择是包含一个 polyfill在您的网站上

不幸的是，您网站的这方面将依赖于 JS，因此如果客户端将其关闭，将无法工作