index.css 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347
  1. html
  2. {
  3. -ms-text-size-adjust:100%;
  4. -webkit-text-size-adjust:100%
  5. }
  6. body
  7. {
  8. line-height:1.6;
  9. font-family:"Helvetica Neue",Helvetica,Arial,sans-serif
  10. }
  11. *
  12. {
  13. margin:0;
  14. padding:0
  15. }
  16. a img
  17. {
  18. border:0
  19. }
  20. a
  21. {
  22. text-decoration:none
  23. }
  24. input,textarea
  25. {
  26. -webkit-appearance:none
  27. }
  28. a,img,button,input,textarea
  29. {
  30. -webkit-tap-highlight-color:rgba(255,255,255,0)
  31. }
  32. #container
  33. {
  34. margin:0 auto;
  35. width:675px
  36. }
  37. #container .bg_pink
  38. {
  39. background-color:#fff5f4
  40. }
  41. #container .bg_lightyellow
  42. {
  43. background-color:#fffef4
  44. }
  45. #container .bg_yellow
  46. {
  47. background-color:#ffe464
  48. }
  49. #container .bg_orange
  50. {
  51. background-color:#fab176
  52. }
  53. #container .bg_blue
  54. {
  55. background-color:#a8d3e6
  56. }
  57. #container header
  58. {
  59. background:url('img/header_bg.jpg') no-repeat 0px 0px;
  60. background-size:contain;
  61. padding-top:65px;
  62. height:222px;
  63. box-sizing:border-box
  64. }
  65. #container header p
  66. {
  67. margin-left:45%;
  68. width:40%;
  69. font-size:22px;
  70. line-height:26px;
  71. color:#fff;
  72. text-shadow:1px 1px 1px #511c1c;
  73. font-style:italic;
  74. font-family:SimHei;
  75. font-weight:bold
  76. }
  77. #container header p.date
  78. {
  79. color:#fff03a;
  80. font-weight:normal;
  81. font-family:Arial;
  82. margin-top:5px;
  83. letter-spacing:2px
  84. }
  85. #container header p .hkbg
  86. {
  87. display:inline-block;
  88. vertical-align:text-top;
  89. width:127px;
  90. height:30px;
  91. background-image:url('img/hdbg.png');
  92. background-repeat:no-repeat;
  93. background-size:contain
  94. }
  95. #container section.main
  96. {
  97. font-size:15px;
  98. color:#624b4b
  99. }
  100. #container section.main .inner
  101. {
  102. width:465px;
  103. margin:0 auto;
  104. padding:25px
  105. }
  106. #container section.main .tbinner
  107. {
  108. margin:0 auto;
  109. padding:25px
  110. }
  111. #container section.main p.article:first-letter
  112. {
  113. font-size:18px;
  114. font-weight:500;
  115. line-height:16px;
  116. float:left;
  117. padding-top:3px
  118. }
  119. #container section.main p.table_title
  120. {
  121. color:#6d483d;
  122. font-size:18px;
  123. padding:20px 30px 10px
  124. }
  125. #container section.main p.table_desc
  126. {
  127. margin-top:30px;
  128. font-size:15px;
  129. text-align:center;
  130. color:#624b4b;
  131. font-weight:bold
  132. }
  133. #container section.main p.chart_title
  134. {
  135. color:#624b4b;
  136. font-size:15px;
  137. text-align:center;
  138. line-height:50px
  139. }
  140. #container section.main p.chart_title>b
  141. {
  142. font-size:160%
  143. }
  144. #container section.main p.thanks
  145. {
  146. margin-top:30px;
  147. color:#6d483d;
  148. font-size:18px;
  149. line-height:22px;
  150. text-indent:36px
  151. }
  152. #container section.main b
  153. {
  154. padding:0 2px;
  155. color:#ee5b5c;
  156. font-size:120%
  157. }
  158. #container section.main table
  159. {
  160. margin:0 auto;
  161. border-collapse:collapse;
  162. font-size:18px;
  163. color:#6d483d;
  164. border-radius:5px;
  165. min-width:450px;
  166. max-width:515px
  167. }
  168. #container section.main table.mt3
  169. {
  170. margin-top:30px
  171. }
  172. #container section.main table,#container section.main th,#container section.main td
  173. {
  174. border:1px solid #fff;
  175. text-align:center;
  176. font-weight:normal
  177. }
  178. #container section.main tr
  179. {
  180. line-height:44px
  181. }
  182. #container section.main th,#container section.main td
  183. {
  184. min-width:90px
  185. }
  186. #container section.main .hdgk,#container section.main .thank
  187. {
  188. display:block;
  189. margin:0 auto;
  190. margin-bottom:10px;
  191. width:75px;
  192. height:75px;
  193. background-image:url('img/hdgk.jpg');
  194. background-repeat:no-repeat;
  195. background-size:contain
  196. }
  197. #container section.main .thank
  198. {
  199. background-image:url('img/thank.png')
  200. }
  201. #container section.main .title
  202. {
  203. display:block;
  204. margin:0 auto;
  205. width:155px;
  206. height:35px;
  207. background-repeat:no-repeat;
  208. background-size:contain
  209. }
  210. #container section.main .jdsjzj
  211. {
  212. background-image:url('img/jdsjzj.png')
  213. }
  214. #container section.main .hdfx
  215. {
  216. background-image:url('img/hdfx.png')
  217. }
  218. #container section.main .yhnnbl
  219. {
  220. background-image:url('img/yhnnbl.png')
  221. }
  222. #container section.main .hdpj
  223. {
  224. background-image:url('img/hdpj.png')
  225. }
  226. #container section.main .hdfk
  227. {
  228. background-image:url('img/hdfk.png')
  229. }
  230. #container section.main .fhqd
  231. {
  232. background-image:url('img/fhqd.png')
  233. }
  234. #container section.main .db
  235. {
  236. margin-top:30px;
  237. overflow:hidden
  238. }
  239. #container section.main .db li
  240. {
  241. float:left;
  242. list-style:none;
  243. width:33.33333333%;
  244. padding-top:80px;
  245. text-align:center;
  246. background-repeat:no-repeat;
  247. background-position:top center
  248. }
  249. #container section.main .db li.db_1
  250. {
  251. background-image:url('img/db1.png')
  252. }
  253. #container section.main .db li.db_2
  254. {
  255. background-image:url('img/db2.png')
  256. }
  257. #container section.main .db li.db_3
  258. {
  259. background-image:url('img/db3.png')
  260. }
  261. #container section.main .db h2
  262. {
  263. font-size:15px;
  264. line-height:36px
  265. }
  266. #container section.main .db p
  267. {
  268. font-size:12px;
  269. line-height:15px
  270. }
  271. #container section.main .chart
  272. {
  273. position:relative
  274. }
  275. #container section.main .chart .male,#container section.main .chart .female
  276. {
  277. margin:0 auto;
  278. width:280px;
  279. line-height:135px;
  280. font-size:24px;
  281. box-sizing:border-box;
  282. color:#6d483d;
  283. background-repeat:no-repeat
  284. }
  285. #container section.main .chart .male
  286. {
  287. background-image:url('img/male.png');
  288. padding-left:35%
  289. }
  290. #container section.main .chart .female
  291. {
  292. background-image:url('img/female.png');
  293. background-position:right;
  294. padding-left:10%
  295. }
  296. #container section.main .chart .bg_hdpj
  297. {
  298. margin:0 auto;
  299. background-image:url('img/hdpj_bg.png');
  300. background-repeat:no-repeat;
  301. width:382px;
  302. height:154px;
  303. color:#fff;
  304. font-size:24px
  305. }
  306. #container section.main .chart .msxf,#container section.main .chart .wlfw
  307. {
  308. position:absolute;
  309. display:block;
  310. width:40px;
  311. top:30px;
  312. text-align:center
  313. }
  314. #container section.main .chart .msxf
  315. {
  316. left:48px
  317. }
  318. #container section.main .chart .wlfw
  319. {
  320. right:115px
  321. }
  322. #container footer
  323. {
  324. padding:17px 0;
  325. font-size:18px;
  326. color:#fc575a;
  327. position:relative;
  328. font-family:SimHei
  329. }
  330. #container footer .qrcode
  331. {
  332. position:absolute;
  333. top:5px;
  334. right:65%;
  335. display:block;
  336. width:80px;
  337. height:80px;
  338. background-image:url('img/qrcode.png');
  339. background-repeat:no-repeat;
  340. background-color:#fff5f4;
  341. background-size:contain
  342. }
  343. #container footer p
  344. {
  345. margin-left:40%
  346. }