Rumah > hujung hadapan web > tutorial css > Bagaimanakah Saya Boleh Menambah Peralihan Tuding Lancar pada Warna Latar Belakang Menu Saya?

Bagaimanakah Saya Boleh Menambah Peralihan Tuding Lancar pada Warna Latar Belakang Menu Saya?

Linda Hamilton
Lepaskan: 2024-12-15 22:55:12
asal
259 orang telah melayarinya

How Can I Add Smooth Hover Transitions to My Menu Background Colors?

Menambahkan Peralihan Lancar ke Kesan Tuding Menu dengan peralihan

Anda menghadapi masalah peralihan warna latar belakang item menu pada tuding, seperti yang ditunjukkan dalam kod CSS anda. Isu ini berpunca daripada kemungkinan kekurangan sokongan penyemak imbas untuk peralihan.

Untuk mendayakan peralihan dalam penyemak imbas moden seperti Safari, Chrome, Firefox, Opera dan Internet Explorer 10 , pertimbangkan untuk menyemak kod anda:

a {
    background-color: #FF0;
}

a:hover {
    background-color: #AD310B;
    -webkit-transition: background-color 1000ms linear;
    -ms-transition: background-color 1000ms linear;
    transition: background-color 1000ms linear;
}
Salin selepas log masuk

Dalam kod yang disemak ini:

  • Kami telah memudahkan sifat peralihan untuk menyasarkan warna latar belakang sahaja, mengurangkan kemungkinan konflik dengan sifat lain.
  • Kami telah menggantikan kemudahan masuk dengan linear, yang memberikan kesan peralihan yang lebih konsisten merentas penyemak imbas.

Menggunakan kod yang dikemas kini ini, anda harus kini perhatikan kesan pudar yang lancar apabila menuding pada pautan menu dalam penyemak imbas yang disokong.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menambah Peralihan Tuding Lancar pada Warna Latar Belakang Menu Saya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan