ساخت Pageing در Bootstrap
Paging زمانی صورت میگیرد که بخواهید برای مطالب خود صفحه بندی ایجاد کنید و در هر صفحه تعدادی محدود از آیتم ها را به کاربران نشان دهید .با استفاده از فریمورک Bootstrap می توانید Paging های زیبایی تولید کنید .
ابتدا می بایست کدهای زیر ار به قسمت head صفحه خود بیفزاید :
|
1 2 3 4 |
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> |
برای فعال و غیرفعال کردن هر صفحه از کلاس های مربوطه استفاده کنید :
|
1 2 3 4 5 6 7 8 9 |
<ul class="pagination"> <li class="disabled"><a href="#">«</a></li> <li class="active"><a href="#">1</a></li> <li><a href="#">2</a></li> <li><a href="#">3</a></li> <li><a href="#">4</a></li> <li><a href="#">5</a></li> <li><a href="#">»</a></li> </ul> |
نتیجه :
نمونه ای دیگر از نمایش صفحه بندی :
|
1 2 3 4 |
<ul class="pager"> <li class="previous"><a href="#">← Previous</a></li> <li class="next"><a href="#">Next →</a></li> </ul> |
دیدگاهتان را بنویسید
برای نوشتن دیدگاه باید وارد بشوید.