Bagaimana untuk Mencipta Menu Jatuh Turun Diaktifkan Hover dan Alih Keluar Ikon Anak Panah dalam Bootstrap?

Tuding-diaktifkan Menu Jatuh Turun dalam Twitter Bootstrap

Ramai pengguna lebih suka menu Bootstrap mereka jatuh ke bawah semasa melayang, menghapuskan keperluan untuk klik eksplisit . Artikel ini menangani kedua-dua fungsi tuding dan pengalihan keluar ikon anak panah di sebelah tajuk menu.

Tuding Turun Diaktifkan Tuding

Untuk mendayakan lungsur turun automatik pada tuding, gunakan CSS untuk sasaran pilihan menu tersembunyi. Tambahkan kod berikut pada CSS anda:

ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;
}

Untuk reka bentuk responsif, balut kod dalam pertanyaan media:

@media (min-width: 979px) {
  ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;
  }
}

Mengalih Keluar Ikon Anak Panah

• Bootstrap 3: Alih keluar HTML daripada .dropdown-togol elemen anchor.
• Bootstrap 2 & Lower: Sasarkan dan alih keluar anak panah menggunakan pemilih CSS ini:

a.menu:after, .dropdown-toggle:after {
    content: none;
}

Dengan menggabungkan CSS ini pengubahsuaian, anda boleh mencapai menu lungsur yang diaktifkan hover dan menghapuskan ikon anak panah, meningkatkan pengalaman pengguna dan menyesuaikan anda Menu Bootstrap seperti yang dikehendaki.

Atas ialah kandungan terperinci Bagaimana untuk Mencipta Menu Jatuh Turun Diaktifkan Hover dan Alih Keluar Ikon Anak Panah dalam Bootstrap?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!