Nếu bạn có một thanh điều hướng Bootstrap và muốn căn chỉnh mục menu cuối cùng của nó sang bên phải, đoạn mã này là dành cho bạn
Vì vậy, để căn chỉnh mục menu cuối cùng ở bên phải, chúng tôi sử dụng "w-100" trên "navbar-nav" và "ml-auto" trên "thả xuống". Ngoài ra, lưu ý rằng các lớp navbar-toggleable-* đã thay đổi thành navbar-expand-*. Hãy xem một ví dụ
Navbar
-
Home
-
Privacy Policy
-
About Us
-
Dropdown link
-
Books
-
Snippets
-
Quizzes
Một giải pháp khác để căn chỉnh phải thanh điều hướng Bootstrap bao gồm một nút ở bên phải, nằm ngoài điều hướng thu gọn trên thiết bị di động và nó luôn được hiển thị ở mọi độ rộng. Trong ví dụ sau, hãy thay đổi kích thước cửa sổ trình duyệt để xem thanh điều hướng thay đổi như thế nào
Bootstrap 5 Navbar được sử dụng để thêm các liên kết Điều hướng vào trang web. Có thể thêm thanh điều hướng bằng các nút và liên kết để điều hướng qua các trang. Ngoài ra, nó có lớp .navbar-brand
để thêm tên công ty hoặc sản phẩm
Theo mặc định, các thành phần thanh điều hướng Bootstrap 5 được căn chỉnh sang trái. Sau đây, chúng ta sẽ học cách căn chỉnh các mục sang phải
Sử dụng lớp căn chỉnh flex
Vì thanh điều hướng được tạo bằng flexbox. Các mục trên thanh điều hướng có thể được căn chỉnh bằng tiện ích flex. Sử dụng lớp .justify-content-end
trên menu thu gọn để căn chỉnh các mục ở bên phải
Thí dụ. Căn phải các mục trên thanh điều hướng bằng cách sử dụng lớp căn chỉnh linh hoạt
Đây là một ví dụ, để căn chỉnh các mục ở bên phải trong thanh điều hướng. Ở đây, chúng tôi đã sử dụng lớp căn chỉnh flex để làm như vậy
Bootstrap
Navbar
-
Home
-
Course
đầu ra
Đây là đầu ra của chương trình trên
Navbar
- Home
- Course