Berikut ialah beberapa tajuk gaya soalan yang sesuai dengan kandungan yang anda sediakan: * Gelung Animasi CSS: Bagaimana Memudarkan Teks Masuk dan Keluar Tanpa Had tanpa JavaScript? * Mencipta Gelung Pudar Infinite untuk Teks dalam CS-tutorial css-php.cn

Berikut ialah beberapa tajuk gaya soalan yang sesuai dengan kandungan yang anda sediakan: * Gelung Animasi CSS: Bagaimana Memudarkan Teks Masuk dan Keluar Tanpa Had tanpa JavaScript? * Mencipta Gelung Pudar Infinite untuk Teks dalam CS

DDD

Lepaskan： 2024-10-26 12:54:29

asal

1070 orang telah melayarinya

Here are a few question-style titles that fit your provided content:

* CSS Animation Loop: How to Fade Text In and Out Infinitely without JavaScript?
* Creating an Infinite Fading Loop for Text in CSS: Solving the Compatibility Issue
* Making Text

Gelung Animasi CSS Mudah: Memudar Masuk dan Keluar Teks "Memuatkan"

Soalan

Bagaimana anda mencipta infiniti gelung dalam animasi CSS yang memudar teks masuk dan keluar tanpa menggunakan JavaScript? Walaupun mencuba, isu itu masih tidak dapat diselesaikan:

@keyframes flickerAnimation { /* flame pulses */
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
.animate-flicker {
    opacity:1;  
    animation: flickerAnimation 1s infinite;
}

Salin selepas log masuk

Jawapan

Untuk memastikan keserasian merentas penyemak imbas, sertakan awalan vendor dalam CSS anda:

@keyframes flickerAnimation {
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
@-o-keyframes flickerAnimation{
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
@-moz-keyframes flickerAnimation{
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
@-webkit-keyframes flickerAnimation{
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
.animate-flicker {
   -webkit-animation: flickerAnimation 1s infinite;
   -moz-animation: flickerAnimation 1s infinite;
   -o-animation: flickerAnimation 1s infinite;
    animation: flickerAnimation 1s infinite;
}

Salin selepas log masuk

Gunakan kod yang dikemas kini dengan HTML berikut:

<div class="animate-flicker">Loading...</div>

Salin selepas log masuk

Atas ialah kandungan terperinci Berikut ialah beberapa tajuk gaya soalan yang sesuai dengan kandungan yang anda sediakan: * Gelung Animasi CSS: Bagaimana Memudarkan Teks Masuk dan Keluar Tanpa Had tanpa JavaScript? * Mencipta Gelung Pudar Infinite untuk Teks dalam CS. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!