CSS Pagination Tutorial | Coding Tag

CSS Pagination

by Abhishek 20-Jul-16

0 1635


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:


Discount Coupons



Leave a Reply


Comments
    Waiting for your comments