CSS Pagination

by Abhishek 20-Jul-16

165 0 475

CSS Pagination used for lots of page in web site. It's very important for Dynamic websites, Search Engines. It's very important for give the limitation for searches on single page.

Example:

<!DOCTYPE html>
<html>
<head>
<title> CSS Pagination </title>

<style type="text/css">
ul {display:inline-block; list-style:none; }
ul li{float:left; padding:10px; text-decoration:none;}
ul li a{text-decoration:none; background-color:#795548; color:#fff; padding:10px 15px; border-radius:5px;}

ul li a:hover{background-color:#000;}
</style>
</head>

<body>
<ul>
<li> <a href="#"> First Page </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="#"> 7 </a> </li>
<li> <a href="#"> 8 </a> </li>
<li> <a href="#"> 9 </a> </li>
<li> <a href="#"> Last Page </a> </li>
</ul>
</body>

</html>

Result:

CSS Pagination


Share:

Comments

Leave a Reply