typo.scss 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307
  1. @charset "utf-8";
  2. .typo {
  3. button, input, select, textarea {
  4. font: 300 1em/1.8 PingFang SC, Lantinghei SC, Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif;
  5. }
  6. button::-moz-focus-inner,
  7. input::-moz-focus-inner {
  8. padding: 0;
  9. border: 0;
  10. }
  11. table {
  12. border-collapse: collapse;
  13. border-spacing: 0;
  14. }
  15. fieldset, img {
  16. border: 0;
  17. }
  18. blockquote {
  19. position: relative;
  20. //color: #999;
  21. font-weight: 400;
  22. border-left: 1px solid #1abc9c;
  23. padding-left: 1em;
  24. margin: 1em 3em 1em 2em;
  25. }
  26. @media only screen and (max-width: 640px) {
  27. blockquote {
  28. margin: 1em 0;
  29. }
  30. }
  31. acronym, abbr {
  32. border-bottom: 1px dotted;
  33. font-variant: normal;
  34. text-decoration: none;
  35. }
  36. abbr {
  37. cursor: help;
  38. }
  39. del {
  40. text-decoration: line-through;
  41. }
  42. address, caption, cite, code, dfn, em, th, var {
  43. font-style: normal;
  44. font-weight: 400;
  45. }
  46. ul, ol {
  47. list-style: none;
  48. }
  49. caption, th {
  50. text-align: left;
  51. }
  52. q:before, q:after {
  53. content: '';
  54. }
  55. sub, sup {
  56. font-size: 75%;
  57. line-height: 0;
  58. position: relative;
  59. }
  60. :root sub, :root sup {
  61. vertical-align: baseline;
  62. }
  63. sup {
  64. top: -0.5em;
  65. }
  66. sub {
  67. bottom: -0.25em;
  68. }
  69. a {
  70. //color: #1abc9c;
  71. }
  72. a:hover {
  73. text-decoration: underline;
  74. }
  75. a {
  76. border-bottom: 1px solid #1abc9c;
  77. }
  78. a:hover {
  79. //border-bottom-color: #555;
  80. //color: #555;
  81. text-decoration: none;
  82. }
  83. ins, a {
  84. text-decoration: none;
  85. }
  86. u, .typo-u {
  87. text-decoration: underline;
  88. }
  89. mark {
  90. //background: #fffdd1;
  91. border-bottom: 1px solid #ffedce;
  92. padding: 2px;
  93. margin: 0 5px;
  94. }
  95. pre, code, pre tt {
  96. font-family: Courier, 'Courier New', monospace;
  97. }
  98. pre {
  99. //background: #f8f8f8;
  100. border: 1px solid #ddd;
  101. padding: 1em 1.5em;
  102. display: block;
  103. -webkit-overflow-scrolling: touch;
  104. }
  105. hr {
  106. border: none;
  107. border-bottom: 1px solid #cfcfcf;
  108. margin-bottom: 0.8em;
  109. height: 10px;
  110. }
  111. small, .typo-small,
  112. figcaption {
  113. font-size: 0.9em;
  114. //color: #888;
  115. }
  116. strong, b {
  117. font-weight: bold;
  118. //color: #000;
  119. }
  120. [draggable] {
  121. cursor: move;
  122. }
  123. .clearfix:before, .clearfix:after {
  124. content: "";
  125. display: table;
  126. }
  127. .clearfix:after {
  128. clear: both;
  129. }
  130. .clearfix {
  131. zoom: 1;
  132. }
  133. .textwrap, .textwrap td, .textwrap th {
  134. word-wrap: break-word;
  135. word-break: break-all;
  136. }
  137. .textwrap-table {
  138. table-layout: fixed;
  139. }
  140. .serif {
  141. font-family: Palatino, Optima, Georgia, serif;
  142. }
  143. p, pre, ul, ol, dl, form, hr, table,
  144. .typo-p, .typo-pre, .typo-ul, .typo-ol, .typo-dl, .typo-form, .typo-hr, .typo-table, blockquote {
  145. margin-bottom: 1.2em
  146. }
  147. h1, h2, h3, h4, h5, h6 {
  148. font-family: PingFang SC, Verdana, Helvetica Neue, Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif;
  149. font-weight: 100;
  150. //color: #000;
  151. line-height: 1.35;
  152. }
  153. h1, h2, h3, h4, h5, h6,
  154. .typo-h1, .typo-h2, .typo-h3, .typo-h4, .typo-h5, .typo-h6 {
  155. margin-top: 1.2em;
  156. margin-bottom: 0.6em;
  157. line-height: 1.35;
  158. }
  159. h1, .typo-h1 {
  160. font-size: 2em;
  161. }
  162. h2, .typo-h2 {
  163. font-size: 1.8em;
  164. }
  165. h3, .typo-h3 {
  166. font-size: 1.6em;
  167. }
  168. h4, .typo-h4 {
  169. font-size: 1.4em;
  170. }
  171. h5, h6, .typo-h5, .typo-h6 {
  172. font-size: 1.2em;
  173. }
  174. ul, .typo-ul {
  175. margin-left: 1.3em;
  176. list-style: disc;
  177. }
  178. ol, .typo-ol {
  179. list-style: decimal;
  180. margin-left: 1.9em;
  181. }
  182. li ul, li ol, .typo-ul ul, .typo-ul ol, .typo-ol ul, .typo-ol ol {
  183. margin-bottom: 0.8em;
  184. margin-left: 2em;
  185. }
  186. li ul, .typo-ul ul, .typo-ol ul {
  187. list-style: circle;
  188. }
  189. table th, table td, .typo-table th, .typo-table td, table caption {
  190. border: 1px solid #ddd;
  191. padding: 0.5em 1em;
  192. //color: #666;
  193. }
  194. table th, .typo-table th {
  195. // background: #fbfbfb;
  196. }
  197. table thead th, .typo-table thead th {
  198. // background: #f1f1f1;
  199. }
  200. table caption {
  201. border-bottom: none;
  202. }
  203. .typo-input, .typo-textarea {
  204. -webkit-appearance: none;
  205. border-radius: 0;
  206. }
  207. .typo-em, em, legend, caption {
  208. //color: #000;
  209. font-weight: inherit;
  210. }
  211. .typo-em {
  212. position: relative;
  213. }
  214. .typo-em:after {
  215. position: absolute;
  216. top: 0.65em;
  217. left: 0;
  218. width: 100%;
  219. overflow: hidden;
  220. white-space: nowrap;
  221. content: "・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・";
  222. }
  223. img {
  224. max-width: 100%;
  225. }
  226. }