Rumah

Kesan khas JS

Kesan khas CSS3

animasi css3 mengubah animasi berenang ikan kesan khas

Muat turun sekarang Pratonton

<head lang="ms">
<meta charset="UTF-8">
<tajuk>transformasi animasi css3鱼游动特效</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<gaya>
badan{
warna latar belakang: biru muda;
limpahan:tersembunyi;
}
.fishbox{
lebar: 200px;
ketinggian: 200px;
/*warna latar belakang: rgba(0,0,0,0.4);*/
jawatan: mutlak;
kiri:0;
atas:0;
animasi: jalankan 20s linear tak terhingga;
animasi-arah: normal;
}
.ikan{
lebar: 174px;
ketinggian: 126px;
jawatan: mutlak;
kiri:35%;
atas:0;
latar belakang:url(imej/ikan8.png) tiada ulangan kiri atas;
/*peralihan:semua langkah 0.8s(8) ;*/
animasi:aktif1 0.8s langkah(8) tak terhingga;

这是一款基于 css3 animation transform属性制作的鱼游动动画特效，用background-position属性实现两条游动追逐的。

Penafian

Semua sumber di laman web ini disumbangkan oleh netizen atau dicetak semula oleh tapak muat turun utama. Sila semak integriti perisian itu sendiri! Semua sumber di laman web ini adalah untuk rujukan pembelajaran sahaja. Tolong jangan gunakannya untuk tujuan komersial. Jika tidak, anda akan bertanggungjawab untuk semua akibat! Jika terdapat sebarang pelanggaran, sila hubungi kami untuk memadamkannya. Maklumat hubungan: admin@php.cn

Artikel Berkaitan

CSS3 tulen mencipta kesan khas animasi di mana bayang sempadan merebak ke luar

25 Aug 2021

Dalam artikel sebelumnya "Ajar anda langkah demi langkah cara menggunakan CSS3 untuk melaksanakan kesan dinamik butang berlegar dan berkelip", kami memperkenalkan kaedah menggunakan CSS3 untuk menambah kesan dinamik pada butang dan mencapai kesan animasi bayang-bayang berlegar dan berkelip. Hari ini, artikel ini akan berkongsi dengan anda kesan animasi sempadan Mari lihat cara menggunakan CSS3 untuk mencapai kesan animasi bayang sempadan yang merebak ke luar.

Gunakan css untuk mencipta kesan animasi ayunan teks yang menarik

30 Aug 2021

Dalam artikel sebelumnya "Super praktikal! Dalam "Menggunakan CSS3 untuk menindih dan memaparkan dua imej bersama-sama", kami berkongsi dua kesan khas yang menggunakan CSS3 untuk menindih dan memaparkan dua imej bersama-sama. Kali ini kami akan memperkenalkan kepada anda cara menggunakan CSS untuk mencipta kesan animasi text swing Jika anda berminat, anda boleh mempelajarinya~

Bagaimanakah saya boleh mencipta kesan fade-out menggunakan peralihan CSS3?

28 Oct 2024

Peralihan CSS3: Mencapai Kesan Fade-OutDalam CSS3, peralihan menawarkan alat yang berkuasa untuk mencipta kesan visual dinamik. Antara kesan ini ialah...

Bagaimana untuk Mencapai Kesan Fade-Out dalam CSS3: Animasi Kerangka Utama lwn. Peralihan?

27 Oct 2024

Peralihan CSS3 - Kesan Fade outDalam CSS3, mencapai kesan fade-out boleh dicapai melalui penggunaan animasi bingkai utama. Namun, ia...

Lima kod kesan khas dinamik Tahun 2022 Harimau yang hebat [Disyorkan]

25 Jan 2022

Sambut Tahun Baru dengan gembira! Tahun Baru 2022 semakin hampir Tahun ini adalah Tahun Harimau di Renyin. Terdapat aliran produk yang tidak berkesudahan dengan pelbagai imej harimau. Laman web PHP Cina berikut meringkaskan dan mengesyorkan kod kesan khas terkini untuk Tahun Harimau, termasuk kod kesan khas untuk menghantar berkat untuk Tahun Harimau, melukis animasi untuk Tahun Harimau dan kod kesan khas yang lain.

Koleksi 16 kod kesan khas Krismas yang indah dan praktikal!

21 Dec 2021

Krismas akan datang, dan kami pengaturcara juga harus berasa romantis~ Laman web PHP Cina akan berkongsi dengan anda semua jenis kod kesan khas Krismas yang indah dan praktikal, termasuk pelbagai bahan kesan khas pokok Krismas dan kesan khas bahan animasi Santa Claus Seterusnya. dsb., klik pada pautan yang sepadan dalam artikel untuk pratonton dalam talian dan muat turun secara percuma!

Apakah maksud kelas pseudo dan objek pseudo dalam css

27 Apr 2022

Dalam CSS, pseudo-class bermaksud untuk mentakrifkan keadaan khas elemen Anda boleh menambah beberapa kesan khas pemilih Mereka adalah beberapa ciri dan fungsi yang diberikan oleh kelas terbina dalam CSS itu sendiri adalah untuk menambah kesan khas kepada tertentu pemilih. Maksudnya, kesannya boleh dicapai dengan menambah elemen sebenar.

Bagaimanakah Saya Boleh Mencipta Kesan Marquee CSS3 Responsif Tanpa Nilai Berkod Keras?

06 Dec 2024

Kesan Marquee dalam CSS3: Mengelakkan Nilai Khusus untuk Penyesuaian TeksDalam animasi CSS3, selalunya wajar untuk mencipta kesan marquee, di mana teks...