reset.css 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200
  1. /* http://meyerweb.com/eric/tools/css/reset/
  2. v2.0 | 20110126
  3. License: none (public domain)
  4. */
  5. html, body, div, span, applet, object, iframe,
  6. h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  7. a, abbr, acronym, address, big, cite, code,
  8. del, dfn, em, img, ins, kbd, q, s, samp,
  9. small, strike, strong, sub, sup, tt, var,
  10. b, u, i, center,
  11. dl, dt, dd, ol, ul, li,
  12. fieldset, form, label, legend,
  13. table, caption, tbody, tfoot, thead, tr, th, td,
  14. article, aside, canvas, details, embed,
  15. figure, figcaption, footer, header, hgroup,
  16. menu, nav, output, ruby, section, summary,
  17. time, mark, audio, video {
  18. margin: 0;
  19. padding: 0;
  20. border: 0;
  21. font-size: 100%;
  22. font: inherit;
  23. vertical-align: baseline;
  24. box-sizing: border-box;
  25. font-family: Source Han Sans CN;
  26. }
  27. /* HTML5 display-role reset for older browsers */
  28. article, aside, details, figcaption, figure,
  29. footer, header, hgroup, menu, nav, section {
  30. display: block;
  31. }
  32. input{
  33. outline: none;
  34. -webkit-appearance: button;
  35. -webkit-appearance: none;
  36. border-radius: 0;
  37. border:none;
  38. padding:0;
  39. margin:0;
  40. box-sizing: border-box;
  41. }
  42. textarea{
  43. box-sizing: border-box;
  44. resize: none;
  45. outline: none;
  46. padding:0;
  47. margin:0;
  48. }
  49. a{
  50. text-decoration: none;
  51. color: inherit;
  52. }
  53. body {
  54. line-height: 1;
  55. }
  56. ol, ul {
  57. list-style: none;
  58. }
  59. blockquote, q {
  60. quotes: none;
  61. }
  62. blockquote:before, blockquote:after,
  63. q:before, q:after {
  64. content: '';
  65. content: none;
  66. }
  67. table {
  68. border-collapse: collapse;
  69. border-spacing: 0;
  70. }
  71. .clamp {
  72. overflow: hidden;
  73. text-overflow: ellipsis;
  74. white-space: nowrap;
  75. display: block;
  76. }
  77. .clamp2 {
  78. display: -webkit-box;
  79. -webkit-box-orient: vertical;
  80. -webkit-line-clamp: 2;
  81. overflow: hidden;
  82. }
  83. .clamp3 {
  84. display: -webkit-box;
  85. -webkit-box-orient: vertical;
  86. -webkit-line-clamp: 3;
  87. overflow: hidden;
  88. }
  89. .clamp4 {
  90. display: -webkit-box;
  91. -webkit-box-orient: vertical;
  92. -webkit-line-clamp: 3;
  93. overflow: hidden;
  94. }
  95. /* 布局 */
  96. .flex-col {
  97. display: flex;
  98. flex-direction: column;
  99. }
  100. .flex-row {
  101. display: flex;
  102. flex-direction: row;
  103. }
  104. .justify-start {
  105. display: flex;
  106. justify-content: flex-start;
  107. }
  108. .justify-center {
  109. display: flex;
  110. justify-content: center;
  111. }
  112. .justify-end {
  113. display: flex;
  114. justify-content: flex-end;
  115. }
  116. .justify-evenly {
  117. display: flex;
  118. justify-content: space-evenly;
  119. }
  120. .justify-around {
  121. display: flex;
  122. justify-content: space-around;
  123. }
  124. .justify-between {
  125. display: flex;
  126. justify-content: space-between;
  127. }
  128. .align-start {
  129. display: flex;
  130. align-items: flex-start;
  131. }
  132. .align-center {
  133. display: flex;
  134. align-items: center;
  135. }
  136. .align-end {
  137. display: flex;
  138. align-items: flex-end;
  139. }
  140. .fill{
  141. flex:1;
  142. }
  143. .fill{
  144. flex: 1;
  145. }
  146. ::-webkit-scrollbar{ width: 0; height: 0; color: transparent; }
  147. ::-webkit-input-placeholder { /* WebKit, Blink, Edge */ color: #CCCCCC; font-size:1.2rem;}
  148. :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #CCCCCC;font-size: 1.2rem; }
  149. ::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #CCCCCC;font-size: 1.2rem; }
  150. :-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #CCCCCC;font-size: 1.2rem; }
  151. .animate__delay-1s {
  152. -webkit-animation-delay: calc(1s * 1);
  153. animation-delay: calc(1s * 1);
  154. /* -webkit-animation-delay: calc(var(--animate-delay) * 20);
  155. animation-delay: calc(var(--animate-delay) * 20); */
  156. }
  157. .animation_slideInDown{
  158. animation-duration: 1s;
  159. animation-fill-mode: both;
  160. animation-name: slideInDown;
  161. }
  162. @keyframes slideInDown {
  163. from {
  164. -webkit-transform: translate3d(-50%, -100%, 0);
  165. transform: translate3d(-50%, -100%, 0);
  166. visibility: visible;
  167. }
  168. to {
  169. -webkit-transform: translate3d(-50%, 0, 0);
  170. transform: translate3d(-50%, 0, 0);
  171. }
  172. }
  173. .animation_slideOutUp{
  174. animation-duration: 1s;
  175. animation-fill-mode: both;
  176. animation-name: slideOutUp;
  177. }
  178. @keyframes slideOutUp {
  179. from {
  180. -webkit-transform: translate3d(-50%, 0, 0);
  181. transform: translate3d(-50%, 0, 0);
  182. }
  183. to {
  184. visibility: hidden;
  185. -webkit-transform: translate3d(-50%, -100%, 0);
  186. transform: translate3d(-50%, -100%, 0);
  187. }
  188. }