![]()
Thành phần foundation menu đóng vai trò là giải pháp điều hướng linh hoạt và đa năng trong Foundation framework. Nó hợp nhất các thành phần cũ như inline list, side nav, sub nav, và icon bar từ Foundation 5 thành một component duy nhất. Sự thống nhất này giúp đơn giản hóa đáng kể quy trình xây dựng cấu trúc menu điều hướng phức tạp cho các dự án responsive web design. Bằng cách tận dụng các CSS framework và các lớp tiện ích mạnh mẽ của Foundation, nhà phát triển có thể tạo ra các thanh điều hướng hiệu quả. Thành phần menu này được thiết kế để trở thành xương sống cho mọi hệ thống điều hướng trên trang web của bạn, từ đơn giản đến phức tạp.
![]()
Tổng Quan Về Thành Phần Menu Cơ Bản (menu-base)
Thành phần menu trong Foundation được xây dựng dựa trên cấu trúc danh sách không thứ tự HTML tiêu chuẩn. Mỗi phiên bản menu đều được điền đầy bởi các phần tử <li> chứa liên kết <a>. Theo mặc định, một menu cơ bản sẽ được định hướng theo chiều ngang, rất phù hợp cho các thanh điều hướng trên cùng hoặc thanh công cụ. Việc hiểu rõ cấu trúc cơ bản là điều kiện tiên quyết để triển khai các tính năng nâng cao hơn.
Khai Báo Menu Ngang (Horizontal Menu)
Để tạo một menu ngang đơn giản, bạn chỉ cần áp dụng lớp CSS .menu cho phần tử <ul>. Các phần tử danh sách <li> bên trong sau đó sẽ tự động được căn chỉnh để nằm liền kề nhau. Đây là hình thức menu phổ biến nhất, thường được dùng trong header của trang web. Nó cung cấp một giao diện trực quan và dễ tiếp cận cho người dùng trên hầu hết các thiết bị. Các mục menu cần được bọc trong thẻ <a> để đảm bảo tính năng liên kết hoạt động chính xác.
Ngày Cập Nhật: Tháng 11 10, 2025 by Ngô Hồng Thái