Thiết Kế Web

Hướng dẫn phân trang bằng HTML và CSS

Phân trang là thủ thuật được sử dụng bởi rất nhiều trang web và là tính năng cũng rất quan trọng. Đặc biệt với những trang web có nhiều nội dung cần hiển thị thì phân trang là phần không …

Phân trang là thủ thuật được sử dụng bởi rất nhiều trang web và là tính năng cũng rất quan trọng. Đặc biệt với những trang web có nhiều nội dung cần hiển thị thì phân trang là phần không thể thiếu. Bạn không thể truy xuất tất cả dữ liệu mình có và hiển thị ra cùng một lúc được, cho nên những trang web hoạt động dựa trên CSDL phải được phân trang để hiển thị kết quả.

Ở bài viết này mình sẽ giới thiệu cho các bạn một số phong cách thiết kế phân trang hoàn hảo sử dụng mã code HTML và CSS.

pagination

Dưới đây là một số phong cách thiết kế phân trang mà theo mình nghĩ là đẹp và chuyên nghiệp. Các bạn có thể tham khảo và áp dụng vào các dự án thiết kế web sau này.

1.Pagination Flickr

Hình ảnh mà bạn muốn thiết kế một phong cách phân trang Flickr trông như thế này.

flicrk-pagination

Mã HTLM

Mã CSS

2.Pagination Digg

Còn bây giờ bạn muốn thiết kế một phong cách phân trang Digg thì nó sẽ trông như hình phía dưới.

 Immagine 8

Mã HTML

Mã CSS

3.Pagination Clean

Nếu bạn muốn tối thiểu, thiết kế sạch ví dụ này cho thấy làm thế nào để thiết kế một phong cách phân trang rất sạch sẽ trông như thế này.

 Immagine 7

Mã HTML

Mã CSS

Như vậy bài viết này mình đã giới thiệu và hướng dẫn cho các bạn ba phong cách thiết kế phân trang đẹp. Hy vọng bài viết này sẽ giúp ích cho các bạn.

Thẻ:, , , , ,
comments powered by Disqus
Powered by HTH Company