Hướng dẫn table pagination bootstrap
|
 Là một website được viết trên công nghệ web Flutter vì vậy hỗ trợ rất tốt cho người học, kể cả những người học khó tính nhất. Hiện tại website đang tiếp tục được cập nhập nội dung cho phong phú và đầy đủ hơn. Mong các bạn nghé thăm và ủng hộ website mới của chúng tôi. 1- Pagination (Phân trang)Nếu bạn có một trang với nhiều dữ liệu (hoặc cái gì đó tương tự), nó quá dài để hiển thị trên một trang duy nhất, vì vậy bạn phải chia nó ra làm nhiều phần, mỗi phần là một trang, nó chỉ hiển thị một vài dữ liệu, và bạn cần một tập hợp các liên kết (Link) để cho người dùng nhẩy tới trang tiếp theo (Hoặc các trang trước đó). Tập hợp các liên kết đó gọi là một thành phần Pagination (Pagination Component). Khi bạn tìm kiếm điều gì đó trên Google bạn có thể nhìn thấy thành phần Pagination: Trong bài học này chúng ta sẽ tìm hiểu làm thế nào để tạo được một thành phần Pagination với Bootstrap. pagination-example Đây là cấu trúc của Bootstrap Pagination: Thực
tế bạn có thể tạo một thành phần Bootstrap Pagination mà không cần phần tử , nhưng lời khuyên là nên có nó. giống như một gợi ý rằng đây là vùng điều hướng, và có ích đối với các thiết bị như Screen Reader. Bạn có thể thay thế bởi Icon Các phần tử "Next" hoặc
"Previous" bạn có thể thay chúng bởi biểu tượng, nhưng nên có các gợi ý cho Screen Reader bằng cách sử dụng ".sr-only", phần tử này ẩn hoàn toàn đối với tất cả các thiết bị ngoại trừ Screen Reader. pagination-icon-example Sử dụng lớp .active cho Pagination-item để làm nổi bật
item này và nhấn mạnh rằng đây là trang mà người dùng đang xem (trang hiện thời). Và sử dụng lớp .disabled cho các liên kết (Link) nếu bạn muốn vô hiệu hóa nó, người dùng không thể nhấn vào liên kết này. pagination-status-example Nếu bạn
muốn thành phần Pagination to hơn một chút hãy sử dụng lớp .pagination-lg: .pagination .pagination-lg Hoặc muốn có một Pagination nhỏ hơn một chút hãy sử dụng lớp .pagination-sm: .pagination .pagination-sm Bootstrap Pagination thực chất là một Flex Container, vì nó
được thiết lập Css property {display: flex}. Vì vậy một vài lớp tiện ích của Bootstrap Flex có thể áp dụng được cho Pagination: .pagination .justify-content-center .pagination .justify-content-end |
