myPagination.css 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. .pagination ul {
  2. list-style: none;
  3. padding-left: 0;
  4. }
  5. .pagination ul li {
  6. padding: 0 10px;
  7. vertical-align: top;
  8. display: inline-block;
  9. font-size: 14px;
  10. min-width: 36px;
  11. min-height: 28px;
  12. line-height: 28px;
  13. cursor: pointer;
  14. box-sizing: border-box;
  15. text-align: center;
  16. background-color: #ffffff;
  17. color: #333;
  18. border-radius: 6px;
  19. margin: 0 1px;
  20. border: 1px solid #ebebeb;
  21. height: 30px;
  22. }
  23. .pagination ul li:hover {
  24. transform: scale(1.1);
  25. background-color: #e72c22;
  26. color:#fff;
  27. }
  28. .pagination li.active {
  29. background: #e72c22;
  30. color: white;
  31. cursor: not-allowed;
  32. }
  33. .pagination li.disabled {
  34. cursor: not-allowed;
  35. }
  36. .pagination li.totalPage {
  37. background: transparent;
  38. cursor: default;
  39. border: none;
  40. padding: 0 6px;
  41. }
  42. .pagination li.totalPage:hover {
  43. transform: none;
  44. background-color: #ffffff;
  45. color:#333;
  46. }
  47. .pagination li input {
  48. -webkit-appearance: none;
  49. background-color: #fff;
  50. background-image: none;
  51. border-radius: 4px;
  52. border: 1px solid #dcdfe6;
  53. box-sizing: border-box;
  54. color: #606266;
  55. display: inline-block;
  56. font-size: inherit;
  57. outline: none;
  58. padding: 3px 5px;
  59. transition: border-color .2s cubic-bezier(.645,.045,.355,1);
  60. width: 40px;
  61. height: 25px;
  62. margin: 0 6px;
  63. }
  64. .pagination li input:focus{
  65. border-color: #98A6AD;
  66. }
  67. .pagination{
  68. user-select: none;
  69. text-align:center;
  70. }
  71. .pagination ul:nth-child(2){
  72. border-radius: 6px;
  73. }
  74. input[type=number] {
  75. -moz-appearance:textfield;
  76. }
  77. input[type=number]::-webkit-inner-spin-button,
  78. input[type=number]::-webkit-outer-spin-button {
  79. -webkit-appearance: none;
  80. margin: 0;
  81. }