IE 下文字渐变色
2020-11-18 本文已影响0人
iced_lemonade
IE下不支持使用CSS的background-image或者mask属性实现的文字渐变色。
IE9 及以上可以使用SVG来实现文字渐变色：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.text {
font-size: 30px;
font-weight: bold;
}
</style>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" class="svgdata" width="100%">
<defs>
<linearGradient id="grad" x1="0%" y1="0%" x2="0" y2="100%">
<stop offset="0%" style="stop-color:blue;stop-opacity:1" />
<stop offset="100%" style="stop-color:red;stop-opacity:1" />
</linearGradient>
</defs>
<text x="0" y="44" fill="url(#grad)" class="text">IE9支持文字颜色渐变方法</text>
</svg>
</body>
</html>
效果如下：
