以下动画在 Chrome 和 Opera 中运行良好,但在 Mozilla Firefox 中不起作用。我不明白为什么。
有人可以帮我解决这个问题吗?我的 CSS 有什么问题?
#text-logo {
font-family: 'Shrikhand', cursive;
stroke-dashoffset: 100%;
stroke-dasharray: 100%;
-moz-animation: draw 8s forwards ease-in;
-webkit-animation: draw 8s forwards ease-in;
animation: draw 8s forwards ease-in;
background-clip: text;
}
@keyframes draw {
100% {
stroke-dashoffset: 0;
}
}
@-webkit-keyframes draw {
100% {
stroke-dashoffset: 0;
}
}
@-moz-keyframes draw {
100% {
stroke-dashoffset: 0;
}
}Run Code Online (Sandbox Code Playgroud)
<div class="draw_text">
<svg width="1092" height="220">
<text x="150" y="200" fill="#fff" stroke="#333" id="text-logo" stroke-width="2" font-size="95">WHO I AM …Run Code Online (Sandbox Code Playgroud)