随着Web应用和网站的不断发展，分页文本成为了许多站点的必备功能之一。为帮助开发者增强分页的设计能力，下面列举了24款漂亮的CSS分页样式。

/* 实心圆形 */.pagination {display: inline-block;border-radius: 50%;background-color: #f2f2f2;}.pagination a {color: #777;display: inline-block;padding: 8px 16px;transition: background-color .3s;}.pagination a.active {background-color: #007bff;color: #fff;}.pagination a:hover:not(.active) {background-color: #ddd;}/* 斜线分割线 */.pagination {display: inline-block;}.pagination a {color: black;float: left;padding: 8px 16px;text-decoration: none;transition: background-color .3s;}.pagination a.active {background-color: #007bff;color: white;}.pagination a:hover:not(.active) {background-color: #ddd;}.pagination a:first-child {border-top-left-radius: 5px;border-bottom-left-radius: 5px;}.pagination a:last-child {border-top-right-radius: 5px;border-bottom-right-radius: 5px;}/* 数字页码 */.pagination {display: inline-block;}.pagination a {color: black;float: left;padding: 8px 16px;text-decoration: none;transition: background-color .3s;}.pagination a.active {background-color: #007bff;color: white;}.pagination a:hover:not(.active) {background-color: #ddd;}/* 左右箭头 */.pagination {display: inline-block;}.pagination a {color: black;float: left;padding: 8px 16px;text-decoration: none;transition: background-color .3s;}.pagination a.active {background-color: #007bff;color: white;}.pagination a:hover:not(.active) {background-color: #ddd;}/* 分段 */.pagination {display: inline-block;}.pagination span {display: inline-block;color: black;float: left;padding: 8px 16px;text-decoration: none;transition: background-color .3s;margin-right: 4px;}.pagination a {color: #007bff;float: left;padding: 8px 16px;text-decoration: none;transition: background-color .3s;}.pagination a.active {background-color: #007bff;color: white;}.pagination a:hover:not(.active) {background-color: #ddd;}/* 图标 */.pagination {display: inline-block;}.pagination a {color: black;float: left;padding: 8px 16px;text-decoration: none;transition: background-color .3s;}.pagination a.active {background-color: #007bff;color: white;}.pagination a:hover:not(.active) {background-color: #ddd;}.pagination .prev, .pagination .next {display: inline-block;padding: 4px;margin: 0 4px;color: #007bff;border: 1px solid #007bff;border-radius: 50%;}.pagination .prev:hover, .pagination .next:hover {color: white;background-color: #007bff;}