Create simple Pagination using Bootstrap classes in HTML,PHP

How to design numeric pagination with next page and previous page arrow buttons on webpage.

Pagination feature is used in all those websites or blogs who have lots of webpages and using pagination web developer can manage these pages one by one. Pagination shows multiple pages by dividing into multiple segments. It is also used to show a fix number of post into single page. So here is the complete step by step tutorial for Create simple Pagination using Bootstrap classes in HTML,PHP.

How to Create simple Pagination using Bootstrap classes in HTML,PHP.

https://www.android-examples.com/demo/heading-tag.html

Code for pagination.html file.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Pagination</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

</head>

<body>

<div class="container">

<h1> Simple Pagination </h1>
 
 <ul class="pagination">
 <li><a href="#">&laquo;</a></li>
 <li><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="#">6</a></li>
 <li><a href="#">&raquo;</a></li>
</ul>
 
</div>

</body>
</html>

Screenshot:

Create simple Pagination using Bootstrap classes in HTML,PHP

 

Leave a Reply

Your email address will not be published. Required fields are marked *