我正在嘗試撰寫一個文本不斷改變顏色的代碼，它可以作業，但由于某種原因它給了我一個箭頭，我不明白為什么這里是 CSS 代碼
.colorchange {
font-family: futura;
font-style: italic;
width: 100%;
margin: 0 auto;
text-align: center;
color: #313131;
font-size: 45px;
font-weight: bold;
position: absolute;
-webkit-animation: colorchange 5s infinite alternate;
}
@-webkit-keyframes colorchange {
0% {
color: blue;
}
10% {
color: #8e44ad;
}
20% {
color: #1abc9c;
}
30% {
color: #d35400;
}
40% {
color: blue;
}
50% {
color: #34495e;
}
60% {
color: blue;
}
70% {
color: #2980b9;
}
80% {
color: #f1c40f;
}
90% {
color: #2980b9;
}
100% {
color: pink;
}
}
這是其影響的 HTML 代碼：
<h1 class="centered colorchange">
<span>hello</span>
</h1>
錯誤說：
定義關鍵幀時始終定義標準規則“@keyframes”。
還要定義標準屬性“影片”以實作兼容性
它出于某種原因給出了這個錯誤，即使它作業正常有人可以告訴我為什么它說這個錯誤
uj5u.com熱心網友回復：
您會收到警告，請使用@keyframes而不是@-webkit-keyframes. -webkit-animation功能是非標準的。
.colorchange {
font-family: futura;
font-style: italic;
width: 100%;
margin: 0 auto;
text-align: center;
color: #313131;
font-size: 45px;
font-weight: bold;
position: absolute;
-webkit-animation: colorchange 5s infinite alternate;
}
/* Used "@keyframes" instead of "@-webkit-keyframes". */
@keyframes colorchange {
0% { color: blue; }
10% { color: #8e44ad; }
20% { color: #1abc9c; }
30% { color: #d35400; }
40% { color: blue; }
50% { color: #34495e; }
60% { color: blue; }
70% { color: #2980b9; }
80% { color: #f1c40f; }
90% { color: #2980b9; }
100% { color: pink; }
}<h1 class="centered colorchange">
<span>hello</span>
</h1>uj5u.com熱心網友回復：
用@keyframes 替換@-webkit-keyframes colorchange，用影片替換-webkit-animation
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/414277.html
標籤：