Bagaimana Saya Boleh Mencipta Dropdown Diaktifkan Hover dalam Twitter Bootstrap?

Tuding Turun untuk Twitter Bootstrap

Apabila menggunakan sistem menu Twitter Bootstrap, adalah wajar untuk menu turun secara automatik pada tuding, menghapuskan keperluan untuk mengklik tajuk menu. Selain itu, pengguna mungkin memilih untuk menyembunyikan anak panah navigasi bersebelahan dengan tajuk menu.

CSS untuk Tuding Tuding

Untuk mendayakan lungsur turun automatik pada tuding, laksanakan CSS berikut:

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

Untuk kefungsian responsif, bungkus kod dalam media pertanyaan:

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

CSS untuk Menyembunyikan Anak Panah Navigasi

Bootstrap 3:

Alih keluar HTML daripada sauh .dropdown-togol elemen.

<a class="dropdown-toggle" data-toggle="dropdown" href="#">
    Dropdown
</a></p>
<p><strong>Bootstrap 2 & Lower:</strong></p>
<p>Sasarkan dan alih keluar anak panah menggunakan pemilih dan kod CSS ini:</p>
<pre class="brush:php;toolbar:false">a.menu:after, .dropdown-toggle:after {
    content: none;
}

Pemahaman cara elemen CSS ini berfungsi akan meningkatkan keupayaan anda untuk menyesuaikan menu Bootstrap untuk memenuhi keperluan khusus anda.

Atas ialah kandungan terperinci Bagaimana Saya Boleh Mencipta Dropdown Diaktifkan Hover dalam Twitter Bootstrap?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!