reset.css 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254
  1. body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; }
  2. body, button, input, select, textarea {font-size:14px;color: #303133; }
  3. h1, h2, h3, h4, h5, h6{ font-size:100%; }
  4. address, cite, dfn, em, var { font-style:normal; }
  5. code, kbd, pre, samp { font-family:couriernew, courier, monospace; }
  6. small{ font-size:12px; }
  7. ul, ol { list-style:none; }
  8. a { text-decoration:none; }
  9. a:hover { text-decoration:underline; }
  10. sup { vertical-align:text-top; }
  11. sub{ vertical-align:text-bottom; }
  12. legend { color:#000; }
  13. fieldset, img { border:0; }
  14. button, input, select, textarea { font-size:100%; }
  15. table { border-collapse:collapse; border-spacing:0; }
  16. /* 盒子模型 */
  17. .flex-box {
  18. display: -webkit-box;
  19. display: -moz-box;
  20. display: -ms-flexbox;
  21. display: -webkit-flex;
  22. display: flex;
  23. }
  24. /*盒子模型,竖向自适应,垂直排列 */
  25. .flex-box-v {
  26. display: -webkit-box;
  27. display: -webkit-flex;
  28. display: flex;
  29. -webkit-box-orient: vertical;
  30. -webkit-flex-flow: column;
  31. flex-flow: column !important;
  32. }
  33. /* 水平等列排版(容器左右没缝隙,子元素左右两边自适应) */
  34. .flex-d-center {
  35. justify-content: space-between;
  36. -webkit-justify-content: space-between;
  37. }
  38. /* 水平等列排版(子元素两边有缝隙自己适应) */
  39. .flex-dv-center {
  40. justify-content: space-around;
  41. -webkit-justify-content: space-around;
  42. }
  43. /*通过一起使用 box-align 和 box-pack 属性,对 view 框的子元素进行居中,目前没有浏览器支持box-align 和 box-pack 属性,所以需要加上浏览器内核-webkit,-moz等的简写 */
  44. .flex-center-center {
  45. justify-content: center;
  46. -webkit-justify-content: center;
  47. -moz-justify-content: center;
  48. align-items: center;
  49. -webkit-align-items: center;
  50. -webkit-box-pack: center;
  51. -webkit-box-align: center;
  52. -moz-align-items: center;
  53. -moz-box-pack: center;
  54. -moz-box-align: center;
  55. }
  56. /*对view中的子元素进行居中,并且位于容器的中间位置(flex-box水平;flex-box-v垂直) */
  57. .flex-v-zhu,
  58. .flex-h-zhu {
  59. justify-content: center;
  60. -webkit-justify-content: center;
  61. -webkit-box-pack: center;
  62. }
  63. /*对view中的子元素进行居中,并且位于容器的中间位置(flex-box垂直;flex-box-v水平) */
  64. .flex-v-ce,
  65. .flex-h-ce {
  66. align-items: center;
  67. -webkit-align-items: center;
  68. -webkit-box-align: center;
  69. }
  70. /*让所有弹性盒模型对象的子元素都有相同的长度,且忽略它们内部的内容: */
  71. .flex-1 {
  72. -webkit-box-flex: 1;
  73. -moz-box-flex: 1;
  74. -webkit-flex: 1;
  75. -ms-flex: 1;
  76. flex: 1;
  77. }
  78. .flex-2 {
  79. -webkit-box-flex: 2;
  80. box-flex: 2;
  81. -moz-box-flex: 2;
  82. -webkit-flex: 2;
  83. -ms-flex: 2;
  84. flex: 2;
  85. }
  86. .flex-3 {
  87. -webkit-box-flex: 3;
  88. box-flex: 3;
  89. -moz-box-flex: 3;
  90. -webkit-flex: 3;
  91. -ms-flex: 3;
  92. flex: 3;
  93. }
  94. .flex-4 {
  95. -webkit-box-flex: 4;
  96. box-flex: 4;
  97. -moz-box-flex: 4;
  98. -webkit-flex: 4;
  99. -ms-flex: 4;
  100. flex: 4;
  101. }
  102. .flex-5 {
  103. -webkit-box-flex: 5;
  104. box-flex: 5;
  105. -moz-box-flex: 5;
  106. -webkit-flex: 5;
  107. -ms-flex: 5;
  108. flex: 5;
  109. }
  110. .flex-direction-row-reverse {
  111. flex-direction: row-reverse;
  112. -webkit-flex-direction: row-reverse;
  113. }
  114. /*超出部分用....表示的公用样式 */
  115. .font-flex-word {
  116. overflow: hidden;
  117. text-overflow: ellipsis;
  118. white-space: nowrap;
  119. }
  120. /* 内容超出部分自动换行 */
  121. .flex-d-wrap {
  122. flex-wrap: wrap;
  123. }
  124. /* 内容超出部分不换行 */
  125. .flex-no-wrap {
  126. flex-wrap: nowrap;
  127. }
  128. /* 从右边开始排列 */
  129. .flex-box-end {
  130. display: -webkit-box;
  131. display: -moz-box;
  132. display: -ms-flexbox;
  133. display: -webkit-flex;
  134. display: flex;
  135. justify-content: flex-end;
  136. }
  137. /* 字体颜色 */
  138. .blue {
  139. color: #26A2FF!important;
  140. }
  141. .red {
  142. color: #F56C6C!important;
  143. }
  144. .yellow {
  145. color: #E6A23C!important;
  146. }
  147. .green {
  148. color: #67C23A!important;
  149. }
  150. .fontColorZ {
  151. color: #303133!important;
  152. }
  153. .fontColorF {
  154. color: #606266 !important;
  155. }
  156. .fontColorT {
  157. color: #C0C4CC!important;
  158. }
  159. /* 整体布局样式 */
  160. .all{
  161. background-color: #fff;
  162. border-radius: 5px;
  163. min-height:calc(100vh - 184px);
  164. min-width: 800px;
  165. position: relative;
  166. }
  167. .terr-left {
  168. width: 200px;
  169. box-sizing: border-box;
  170. padding: 20px 10px;
  171. max-height: 600px;
  172. overflow: auto;
  173. }
  174. .terr-left::-webkit-scrollbar {
  175. width: 3px;
  176. height: 3px;
  177. background-color: #fff;
  178. }
  179. .terr-left::-webkit-scrollbar-thumb {
  180. background-color: #D9D9D9;
  181. }
  182. .terr-right{
  183. padding: 20px;
  184. min-width: 600px;
  185. box-sizing: border-box;
  186. }
  187. .border-right:after {
  188. content: ' ';
  189. position: absolute;
  190. top: 0;
  191. left: 200px;
  192. bottom: 0;
  193. width: 1px;
  194. background: #ebeef5;
  195. }
  196. .border-right {
  197. /* position: relative; */
  198. }
  199. .margin-bottom{
  200. margin-bottom: 20px;
  201. }
  202. .diy-tip {
  203. margin-bottom: 10px !important;
  204. background: #f0f9eb !important;
  205. color: #67c23a !important;
  206. border: 1px solid #67c23a !important;
  207. padding:16px !important;
  208. min-width: 800px;
  209. border-radius: 4px;
  210. }
  211. .diy-tip p{
  212. color: #67c23a !important;
  213. }
  214. /* 分页样式 */
  215. .pagination{
  216. padding: 20px 0;
  217. text-align: center;
  218. }
  219. /* EL UI 重置 */
  220. .notifyBox{
  221. width: auto !important;
  222. }