datatables_style.css 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217
  1. html,body {
  2. margin: 0;
  3. padding: 0;
  4. margin-top: 3px;
  5. }
  6. .dataTables_wrapper {
  7. position: relative;
  8. min-height: 100%;
  9. clear: both;
  10. _height: 100%;
  11. zoom: 1; /* Feeling sorry for IE */
  12. }
  13. /*加载信息样式*/
  14. .dataTables_processing {
  15. position: absolute;
  16. top: 45%;
  17. left: 50%;
  18. width: 200px;
  19. height: 20px;
  20. margin-left: -125px;
  21. margin-top: -15px;
  22. padding: 14px 0 2px 0;
  23. border: 1px solid #ddd;
  24. text-align: center;
  25. color: #ddd;
  26. font-size: 14px;
  27. background-color: white;
  28. }
  29. /*列表长度文字描述宽度*/
  30. div.dataTables_length label {
  31. width: 150px;
  32. float: left;
  33. text-align: left;
  34. }
  35. /*列表长度下拉框宽度*/
  36. div.dataTables_length select {
  37. width: 60px;
  38. }
  39. /*搜索框长度*/
  40. div.dataTables_filter label {
  41. float: right;
  42. width:250px;
  43. }
  44. /*列表INFO设置*/
  45. div.dataTables_info {
  46. padding-top:0px;
  47. width: 60%;
  48. float: left;
  49. }
  50. /*分页条样式*/
  51. div.dataTables_paginate {
  52. text-align: right;
  53. float: right;
  54. margin: 0;
  55. }
  56. /* Pagination nested */
  57. .paginate_disabled_previous, .paginate_enabled_previous, .paginate_disabled_next, .paginate_enabled_next {
  58. height: 19px;
  59. width: 19px;
  60. margin-left: 3px;
  61. float: left;
  62. }
  63. /*表格边距*/
  64. table {
  65. margin: 2px 0;
  66. clear: both;
  67. }
  68. table.dataTable th:active {
  69. outline: none;
  70. }
  71. .uneditable-input:focus {
  72. border-color: rgba(82, 168, 236, 0.8);
  73. outline: 0;
  74. /* IE6-9 搜索框样式 */
  75. -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
  76. -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
  77. box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
  78. }
  79. h1,h2,h3,h4,h5,h6{margin:0;font-family:'Telex',sans-serif;font-weight:bold;color:#317eac;text-rendering:optimizelegibility;}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{font-weight:normal;color:#999999;}
  80. h4{font-size:14px;}h4 small{font-size:12px;}
  81. body{margin:0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;line-height:12px;color:#555555;background-color:#ffffff;}
  82. .table tbody tr:hover td,.table tbody tr:hover th{background-color:#f5f5f5;}
  83. label,input,button,select,textarea{font-size:12px;font-weight:normal;line-height:10px;}
  84. table .header {
  85. cursor: pointer;
  86. }
  87. table .header:after {
  88. content: "";
  89. float: right;
  90. margin-top: 5px;
  91. border-width: 0 4px 4px;
  92. border-style: solid;
  93. border-color: #000 transparent;
  94. visibility: hidden;
  95. }
  96. table .headerSortUp,table .headerSortDown {
  97. background-color: rgba(141, 192, 219, 0.25);
  98. text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  99. }
  100. table .header:hover:after {
  101. visibility: visible;
  102. }
  103. table .headerSortDown:after,table .headerSortDown:hover:after {
  104. visibility: visible;
  105. filter: alpha(opacity = 60);
  106. -khtml-opacity: 0.6;
  107. -moz-opacity: 0.6;
  108. opacity: 0.6;
  109. }
  110. table .headerSortUp:after {
  111. border-bottom: none;
  112. border-left: 4px solid transparent;
  113. border-right: 4px solid transparent;
  114. border-top: 4px solid #000;
  115. visibility: visible;
  116. -webkit-box-shadow: none;
  117. -moz-box-shadow: none;
  118. box-shadow: none;
  119. filter: alpha(opacity = 60);
  120. -khtml-opacity: 0.6;
  121. -moz-opacity: 0.6;
  122. opacity: 0.6;
  123. }
  124. table .blue {
  125. color: #049cdb;
  126. border-bottom-color: #049cdb;
  127. }
  128. table .headerSortUp.blue,table .headerSortDown.blue {
  129. background-color: #ade6fe;
  130. }
  131. table .green {
  132. color: #46a546;
  133. border-bottom-color: #46a546;
  134. }
  135. table .headerSortUp.green,table .headerSortDown.green {
  136. background-color: #cdeacd;
  137. }
  138. table .red {
  139. color: #9d261d;
  140. border-bottom-color: #9d261d;
  141. }
  142. table .headerSortUp.red,table .headerSortDown.red {
  143. background-color: #f4c8c5;
  144. }
  145. table .yellow {
  146. color: #ffc40d;
  147. border-bottom-color: #ffc40d;
  148. }
  149. table .headerSortUp.yellow,table .headerSortDown.yellow {
  150. background-color: #fff6d9;
  151. }
  152. table .orange {
  153. color: #f89406;
  154. border-bottom-color: #f89406;
  155. }
  156. table .headerSortUp.orange,table .headerSortDown.orange {
  157. background-color: #fee9cc;
  158. }
  159. table .purple {
  160. color: #7a43b6;
  161. border-bottom-color: #7a43b6;
  162. }
  163. table .headerSortUp.purple,table .headerSortDown.purple {
  164. background-color: #e2d5f0;
  165. }
  166. /*分页条样式*/
  167. .pagination {
  168. height: 20px;
  169. margin: 5px 0;
  170. }
  171. .pagination ul > li > a,
  172. .pagination ul > li > span {
  173. float: left;
  174. padding: 0 10px;
  175. line-height: 25px;
  176. text-decoration: none;
  177. background-color: #ffffff;
  178. border: 1px solid #dddddd;
  179. border-left-width: 0;
  180. }
  181. /*列表样式*/
  182. .table {
  183. width: 100%;
  184. margin-bottom: 5px;
  185. }
  186. .table th,
  187. .table td {
  188. padding: 6px;
  189. line-height: 17px;
  190. text-align: left;
  191. vertical-align: top;
  192. border-top: 1px solid #dddddd;
  193. }