微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

html5 – 为什么字体上的剪辑路径,透视和线性渐变不适用于IE11 / Edge

我正在尝试制作一些多边形,旋转动画效果和字体上的渐变. Chrome和Firefox工作正常,但Internet Explorer 11无法正常工作.我在SASS工作.
我已经做了一些研究尝试了一些例子,但非有效.
我在IE / 11上遇到了一些问题.

>预期财产(包括前缀/
不工作)
> clip-path:多边形不起作用
>线性渐变不适用于字体

display: inline-block;
background-image: linear-gradient(to right top,#bd74c2,#69306D);
-webkit-background-clip: text;
-ms-background-clip: text;

这是我的代码JSFiddle

在我的研究中,它说这个属性的一些将在IE10上工作但我在IE11上有问题.有没有其他方法来处理这些属性.

解决方法

IE11上的问题是-ms-background-clip:text不起作用.
更多信息可以在caniuse网站上找到:

Firefox,Chrome and Safari support the unofficial
-webkit-background-clip: text (only with prefix)

参考:https://caniuse.com/#search=background-clip

您在IE11上的选项将是您的字体回落到平面颜色(优雅降级),使用svg而不是建议的DayOne或用该浏览器上的图像替换文本(严重老派)

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。