Simple Pagination in html and css on December 06, 2021 Get link Facebook Twitter Pinterest Email Other Apps Simple Pagination in html and css Html part <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Simple Pagination</title> <link rel="stylesheet" href="style.css"> </head> <body> <h1>Simple Pagination</h1> <div class="pagination"> <a href="#">«</a> <a href="#">1</a> <a href="#">2</a> <a href="#">3</a> <a href="#">4</a> <a href="#">5</a> <a href="#">6</a> <a href="#">7</a> <a href="#">»</a> </div> </body> </html> CSS part *{ margin: 0; padding: 0; box-sizing: border-box; } body{ background: #333; min-height: 100vh; margin-left: 80px; margin-top: 50px; } h1{ color: #fff; } .pagination{ display: inline-block; } .pagination a{ font-size: 20px; float: left; text-decoration: none; padding: 8px 16px; color: #fff; transition: .2s; } .pagination a:hover{ background: lightblue; color: #000; } Comments
Comments
Post a Comment