我的CSS动画可以在除Safari之外的所有单个浏览器上使用。有人可以告诉我为什么会这样,或者我需要进行哪些更改才能使其普遍运行?
#job-title:before {
content: '';
animation-name: animate;
animation-iteration-count: infinite;
animation-timing-function: linear;
animation-duration: 4s;
animation-delay: 1s;
}
@keyframes animate {
0% {
content: "Web Developer.";
}
50% {
content: "Web Designer.";
}
100% {
content: "Graphic Designer.";
}
}
答案 0 :(得分:0)
您可以尝试为动画添加-webkit
前缀吗?
#job-title:before {
content: '';
-webkit-animation-name: animate;
animation-name: animate;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-duration: 4s;
animation-duration: 4s;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
@-webkit-keyframes animate {
0% {
content: "Web Developer.";
}
50% {
content: "Web Designer.";
}
100% {
content: "Graphic Designer.";
}
}
@keyframes animate {
0% {
content: "Web Developer.";
}
50% {
content: "Web Designer.";
}
100% {
content: "Graphic Designer.";
}
}