mricode.pagination.css 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146
  1. /* update 2015-4-14 */
  2. ul {
  3. margin: 0;
  4. padding: 0;
  5. }
  6. .m-pagination {
  7. margin: 10px 0;
  8. height: 38px;
  9. }
  10. .m-pagination-page,
  11. .m-pagination-info,
  12. .m-pagination-size,
  13. .m-pagination-jump {
  14. float: left;
  15. margin-top: 2px;
  16. padding-right: 10px;
  17. }
  18. /* font */
  19. .m-pagination-page > li > a,
  20. .m-pagination-size > select,
  21. .m-pagination-group > input,
  22. .m-pagination-group > button,
  23. .m-pagination-info {
  24. font-size: 16px;
  25. font-family: 'Microsoft YaHei';
  26. color: #888;
  27. }
  28. /* border */
  29. .m-pagination-page > li > a,
  30. .m-pagination-size > select,
  31. .m-pagination-group > input,
  32. .m-pagination-group > button {
  33. outline: none;
  34. user-select: none;
  35. -moz-user-select: none;
  36. -webkit-user-select: none;
  37. -ms-user-select: none;
  38. -khtml-user-select: none;
  39. border: 1px solid #ddd;
  40. }
  41. /* button */
  42. .m-pagination-page > li > a,
  43. .m-pagination-group > button {
  44. cursor: pointer;
  45. background-color: #fff;
  46. /*background-image: -webkit-linear-gradient(top,#fff 0,#e0e0e0 100%);
  47. background-image: -o-linear-gradient(top,#fff 0,#e0e0e0 100%);
  48. background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#e0e0e0));
  49. background-image: linear-gradient(to bottom,#fff 0,#e0e0e0 100%);
  50. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
  51. filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  52. background-repeat: repeat-x;*/
  53. }
  54. .m-pagination-page > li:hover > a,
  55. .m-pagination-group > button:hover {
  56. background-color: #eee;
  57. border-color: #ddd;
  58. }
  59. /************* pagination-page *************/
  60. .m-pagination-page > li {
  61. list-style: none;
  62. float: left;
  63. }
  64. .m-pagination-page > li > a {
  65. height: 34px;
  66. line-height: 34px;
  67. margin-left: -1px;
  68. display: inline-block;
  69. padding: 0 12px;
  70. text-decoration: none;
  71. box-sizing: content-box;
  72. }
  73. .m-pagination-page > li.active > a {
  74. color: #fff;
  75. background-color: #009688;
  76. border-color: #009688;
  77. }
  78. .m-pagination-page > li:first-child > a {
  79. margin-left: 0;
  80. border-top-left-radius: 4px;
  81. border-bottom-left-radius: 4px;
  82. }
  83. .m-pagination-page > li:last-child > a {
  84. border-top-right-radius: 4px;
  85. border-bottom-right-radius: 4px;
  86. }
  87. /************* pagination-perpage *************/
  88. .m-pagination-size > select {
  89. cursor: pointer;
  90. height: 36px;
  91. padding: 0px 8px;
  92. border-radius: 4px;
  93. }
  94. /************* pagination-go *************/
  95. .m-pagination-group > input,
  96. .m-pagination-group > button {
  97. float: left;
  98. }
  99. .m-pagination-group > input {
  100. border-top-left-radius: 4px;
  101. border-bottom-left-radius: 4px;
  102. width: 50px;
  103. height: 34px;
  104. padding: 0px;
  105. text-align: center;
  106. box-sizing: content-box;
  107. }
  108. .m-pagination-group > button {
  109. border-left: none;
  110. border-top-right-radius: 4px;
  111. border-bottom-right-radius: 4px;
  112. height: 36px;
  113. padding: 0px 12px;
  114. }
  115. /************ pagination-info *************/
  116. .m-pagination-info {
  117. height: 36px;
  118. line-height: 36px;
  119. }