Rumah >hujung hadapan web >tutorial css >Bagaimanakah saya boleh membuat navbar dua baris dalam Bootstrap 4?

Bagaimanakah saya boleh membuat navbar dua baris dalam Bootstrap 4?

Susan Sarandonasal: 2024-12-10 00:55:10211semak imbas

How can I create a two-row navbar in Bootstrap 4?

Bootstrap 4 navbar dengan 2 baris

Dalam Bootstrap 4, adalah mungkin untuk mencipta navbar dengan dua baris dengan menggunakan kelas utiliti flexbox. Begini cara anda boleh mencapai ini:

Tambah kelas lajur-flex pada div .navbar-collapse. Ini akan menyusun dua bar navigasi secara menegak.

Tetapkan sifat lajur arah-flex: pada elemen .navbar-jenama. Ini akan menjajarkan logo secara menegak dengan pautan bar navigasi.

Secara pilihan, anda boleh menambah kelas baris-lentur pada bar navigasi kedua untuk menyelaraskan ikon secara mendatar.

Berikut ialah versi kod anda yang dikemas kini:


    
        
        
        
Atas ialah kandungan terperinci Bagaimanakah saya boleh membuat navbar dua baris dalam Bootstrap 4?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
bootstrap using class Property this column flex ul
Kenyataan：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 sebelumnya：Bagaimana untuk Membuat Senarai Tidak Tertib Dua Lajur Menggunakan CSS dan JavaScript?Artikel seterusnya：Bagaimana untuk Membuat Senarai Tidak Tertib Dua Lajur Menggunakan CSS dan JavaScript?

Artikel berkaitan

Lihat lagi