pagination.css 863 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546
  1. .pagination {
  2. display: flex;
  3. justify-content: center;
  4. align-items: center;
  5. list-style-type: none;
  6. padding: 40px 10px 60px 10px;
  7. }
  8. .pagination ul {
  9. list-style-type: none; /* 移除默认的列表样式 */
  10. padding: 0; /* 移除内边距 */
  11. margin: 0; /* 移除外边距 */
  12. display: flex; /* 使用flexbox布局来实现横向排列 */
  13. }
  14. .pagination li {
  15. margin-right: 10px; /* 每个列表项右侧添加间距 */
  16. /* cursor: pointer; */
  17. }
  18. .pagination li.active {
  19. font-weight: bold;
  20. color: red; /* 当前页高亮显示 */
  21. }
  22. .pagination a.active {
  23. font-weight: bold;
  24. color: #333;
  25. text-decoration: none;
  26. pointer-events: none;
  27. }
  28. .pagination input[type="number"] {
  29. width: 50px;
  30. text-align: center;
  31. margin-left: 10px;
  32. }
  33. .pagination button {
  34. margin-left: 10px;
  35. }
  36. .pagination .ellipsis {
  37. margin: 0 10px;
  38. color: #888;
  39. }