style.css 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786
  1. /*
  2. ===================
  3. 初始化
  4. ===================
  5. */
  6. html, body,
  7. div, dl, dt, dd, ul, p, th, td,
  8. h1, h2, h3, h4, h5, h6,
  9. pre, code, form,
  10. fieldset, legend {
  11. margin: 0;
  12. padding: 0;
  13. }
  14. cite,
  15. em,
  16. strong,
  17. th {
  18. font-style: normal;
  19. }
  20. td,
  21. th,
  22. div {
  23. word-break: break-all;
  24. word-wrap: break-word;
  25. }
  26. form {
  27. display: inline;
  28. }
  29. table {
  30. border-collapse: collapse;
  31. border-spacing: 0;
  32. }
  33. th {
  34. text-align: left;
  35. font-weight: 100;
  36. }
  37. ol li {
  38. list-style: decimal outside;
  39. }
  40. ol {
  41. padding: 0 0 0 18px;
  42. margin: 0;
  43. }
  44. li {
  45. list-style: none;
  46. }
  47. img {
  48. border: 0;
  49. }
  50. html {
  51. -webkit-text-size-adjust: none;
  52. overflow-y: scroll;
  53. }
  54. /*
  55. ===================
  56. html5标签
  57. ===================
  58. */
  59. article,
  60. aside,
  61. details,
  62. figcaption,
  63. figure,
  64. footer,
  65. header,
  66. hgroup,
  67. nav,
  68. section {
  69. display: block;
  70. }
  71. /*
  72. ===================
  73. 清除浮动【请勿修改】
  74. >> cc 作用于父模型
  75. >> c 作用于浮动模型后,父模型区域里
  76. ===================
  77. */
  78. .cc {
  79. zoom: 1;
  80. }
  81. .cc:after {
  82. content: '\20';
  83. display: block;
  84. height: 0;
  85. clear: both;
  86. visibility: hidden;
  87. }
  88. .c {
  89. clear: both;
  90. height: 0;
  91. font: 0/0 Arial;
  92. overflow: hidden;
  93. width: 0;
  94. }
  95. /*
  96. ===================
  97. 基础样式
  98. >> b 加粗
  99. >> u 下划线
  100. >> i 斜体
  101. >> w 文本不换行
  102. >> tal 文本靠左显示
  103. >> tac 文本居中显示
  104. >> tar 文本靠右显示
  105. >> fl 左浮动
  106. >> fr 右浮动
  107. >> pr 相对定位
  108. >> cp 鼠标点击手势
  109. >> vt 表格内容靠上显示
  110. ===================
  111. */
  112. .b {
  113. font-weight: 700 !important;
  114. }
  115. .u {
  116. text-decoration: underline !important;
  117. }
  118. .i {
  119. font-style: italic !important;
  120. }
  121. .w {
  122. white-space: nowrap;
  123. }
  124. .tal {
  125. text-align: left !important;
  126. }
  127. .tac {
  128. text-align: center !important;
  129. }
  130. .tar {
  131. padding-left: 20px !important;
  132. }
  133. .fl {
  134. float: left !important;
  135. }
  136. .fr {
  137. float: right !important;
  138. }
  139. .pr {
  140. position: relative;
  141. }
  142. .cp {
  143. cursor: pointer;
  144. }
  145. .vt {
  146. vertical-align: top;
  147. }
  148. .dn {
  149. display: none;
  150. }
  151. /*
  152. ===================
  153. 字体
  154. >> f10 小字体
  155. >> f12 正常字
  156. >> f14 大字
  157. >> f16 更大
  158. >> f24 标题类
  159. >> fn 文本去粗
  160. ===================
  161. */
  162. .f10 {
  163. font-size: 10px;
  164. }
  165. .f12 {
  166. font-size: 12px !important;
  167. }
  168. .f14 {
  169. font-size: 14px;
  170. }
  171. .f16 {
  172. font-size: 16px;
  173. }
  174. .f24 {
  175. font-size: 24px;
  176. font-family: "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, sans-serif;
  177. }
  178. .fn {
  179. font-weight: normal !important;
  180. }
  181. .s1 {
  182. color: #ff0000;
  183. }
  184. /*
  185. ===================
  186. 全局
  187. ===================
  188. */
  189. body {
  190. font: 12px/1.5 "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  191. color: #333;
  192. background-repeat: no-repeat;
  193. background-size: 100% 100%;
  194. background-attachment: fixed;
  195. }
  196. a:link {
  197. color: #246EA5;
  198. text-decoration: none;
  199. }
  200. a:hover {
  201. text-decoration: underline;
  202. }
  203. a:visited {
  204. color: #762e9c;
  205. }
  206. /*
  207. ===================
  208. 包裹
  209. ===================
  210. */
  211. .wrap {
  212. margin: 50px auto 0;
  213. width: 750px;
  214. background: #fff;
  215. }
  216. /*
  217. ===================
  218. 头部
  219. ===================
  220. */
  221. .header {
  222. height: 80px;
  223. position: relative;
  224. color: #333;
  225. background: #fff;
  226. border: 1px solid #e0e0e0;
  227. }
  228. .section {
  229. border: 1px solid #e0e0e0;
  230. border-top: 0;
  231. }
  232. /*
  233. ===================
  234. 主体
  235. ===================
  236. */
  237. .main {
  238. padding-top: 35px;
  239. }
  240. /*
  241. ===================
  242. 底部
  243. ===================
  244. */
  245. .footer {
  246. text-align: center;
  247. padding: 15px 0 50px;
  248. color: #999999;
  249. }
  250. .footer a {
  251. color: #999;
  252. text-decoration: none;
  253. }
  254. .bottom {
  255. padding: 0 0 25px;
  256. }
  257. /*
  258. ===================
  259. 协议
  260. ===================
  261. */
  262. .pact {
  263. box-shadow: 5px 5px 5px #f7f7f7 inset;
  264. border: 1px solid #bdbcbc;
  265. width: 670px;
  266. height: 350px;
  267. padding: 10px;
  268. overflow: hidden;
  269. display: block;
  270. overflow-y: scroll;
  271. margin: 0 auto;
  272. font-size: 12px;
  273. line-height: 1.5;
  274. margin-bottom: 22px;
  275. outline: none;
  276. }
  277. pre {
  278. white-space: pre-wrap;
  279. white-space: -moz-pre-wrap;
  280. white-space: -o-pre-wrap;
  281. word-wrap: break-word;
  282. word-break: normal;
  283. }
  284. /*
  285. ===================
  286. 版本号
  287. ===================
  288. */
  289. .version {
  290. float: right;
  291. margin: 50px 25px 0 0;
  292. }
  293. /*
  294. ===================
  295. LOGO
  296. ===================
  297. */
  298. .logo {
  299. float: left;
  300. width: 230px;
  301. height: 80px;
  302. background: url(../images/logo.png) no-repeat center;
  303. overflow: hidden;
  304. text-indent: -2000em;
  305. }
  306. /*
  307. ===================
  308. 安装类型文案
  309. ===================
  310. */
  311. .icon_install,
  312. .icon_update {
  313. font-size: 20px;
  314. float: left;
  315. margin-top: 26px;
  316. color: #333;
  317. }
  318. /*
  319. ===================
  320. 按钮
  321. ===================
  322. */
  323. .btn,
  324. .btn_old {
  325. display: inline-block;
  326. width: 100px;
  327. height: 30px;
  328. background-color: #04b3af;
  329. font: bold 14px/30px Arial, "Microsoft Yahei", Simsun;
  330. text-decoration: none;
  331. color: #fff !important;
  332. margin: 0 5px;
  333. border: 0 none;
  334. cursor: pointer;
  335. vertical-align: top;
  336. border-radius: 5px;
  337. }
  338. .btn:hover {
  339. opacity: 0.8;
  340. text-decoration: none;
  341. }
  342. a.btn:visited {
  343. color: #ffffff;
  344. }
  345. .btn_old,
  346. .btn_old:hover {
  347. background-position: 0 -60px;
  348. color: #999 !important;
  349. cursor: default;
  350. text-decoration: none;
  351. }
  352. a.btn_old:visited {
  353. color: #999 !important;
  354. }
  355. /*
  356. ===================
  357. 步骤
  358. ===================
  359. */
  360. .step,
  361. .step li em,
  362. .step li {
  363. background: url(../images/step.png) repeat-x;
  364. }
  365. .step {
  366. border-bottom: 1px solid #dce1e5;
  367. height: 60px;
  368. background-color: #fff;
  369. }
  370. .step li {
  371. float: left;
  372. height: 60px;
  373. line-height: 60px;
  374. width: 33%;
  375. text-align: center;
  376. font-size: 14px;
  377. color: #6f7885;
  378. font-weight: 700;
  379. }
  380. .step li em {
  381. width: 32px;
  382. height: 32px;
  383. text-align: center;
  384. line-height: 32px;
  385. display: inline-block;
  386. background-position: 0 -70px;
  387. font-size: 20px;
  388. color: #fff;
  389. font-family: Microsoft Yahei;
  390. margin-right: 10px;
  391. vertical-align: 0;
  392. }
  393. .step li.current {
  394. background-position: right -106px;
  395. background-repeat: no-repeat;
  396. color: #246ea5;
  397. }
  398. .step li.current em {
  399. background-position: -35px -70px;
  400. }
  401. .step li.on {
  402. background-position: 0 -176px;
  403. }
  404. .step li.on em {
  405. background-position: -70px -70px;
  406. }
  407. /*
  408. ===================
  409. 服务器检测/信息输入
  410. ===================
  411. */
  412. .server {
  413. padding: 20px 20px 10px 65px;
  414. }
  415. .server table {
  416. margin-bottom: 20px;
  417. }
  418. .server td {
  419. padding: 3px 5px;
  420. }
  421. .server .td1 {
  422. color: #417b9d;
  423. font-weight: 700;
  424. }
  425. .server .input {
  426. border: 1px solid;
  427. border-color: #e3e9ef;
  428. padding: 3px;
  429. width: 200px;
  430. }
  431. .server .radio {
  432. display: inline-block;
  433. width: 70px;
  434. cursor: pointer;
  435. }
  436. .server .input:hover,
  437. .server .input:focus {
  438. border: 1px solid #0e85d5;
  439. outline: none;
  440. }
  441. .gray {
  442. color: #bbb;
  443. }
  444. /*
  445. ===================
  446. 正确错误
  447. ===================
  448. */
  449. .icon_check,
  450. .icon_error {
  451. display: block;
  452. float: left;
  453. width: 20px;
  454. height: 16px;
  455. text-indent: -2000em;
  456. overflow: hidden;
  457. background: url(../images/icon.png) no-repeat;
  458. margin-right: 5px;
  459. }
  460. .icon_error {
  461. background-position: 0 -23px;
  462. }
  463. /*
  464. ===================
  465. 数据表写入
  466. ===================
  467. */
  468. .install {
  469. box-shadow: 5px 5px 5px #f7f7f7 inset;
  470. border: 1px solid #bdbcbc;
  471. width: 670px;
  472. height: 350px;
  473. padding: 10px;
  474. overflow: hidden;
  475. display: block;
  476. overflow-y: scroll;
  477. margin: 25px auto;
  478. font-size: 12px;
  479. margin-bottom: 22px;
  480. outline: none;
  481. }
  482. .install ul {
  483. line-height: 1.8;
  484. }
  485. /*
  486. ===================
  487. 成功提示
  488. ===================
  489. */
  490. .success_tip {
  491. /*border:1px solid #e0e9f0;*/
  492. background: #fff url(../images/complete.png) 210px center no-repeat;
  493. padding: 50px 80px 50px 300px;
  494. line-height: 2;
  495. }
  496. .success_tip a, .s4 {
  497. color: #0166a5;
  498. text-decoration: none;
  499. }
  500. .success_tip a:hover {
  501. text-decoration: underline;
  502. }
  503. .error_tip {
  504. background: url(../images/ignore.png) 130px 45px no-repeat;
  505. padding: 50px 80px 60px 230px;
  506. }
  507. /*founder login*/
  508. .login {
  509. border: 1px solid #e0e9f0;
  510. background: #fff;
  511. margin: 30px 120px 130px;
  512. }
  513. /*
  514. ===================
  515. 操作提示
  516. >> tips 普通
  517. >> tips_error 错误
  518. >> tips_success 正确
  519. >> tips_loading 加载中
  520. 使用方法
  521. 可独立样式使用,亦可与tips组装,例:
  522. <div class="tips"><span class="tips_error">错误内容</span></div>
  523. 可在外出包裹 tips_block 对错误提示进行块级效果展示
  524. ===================
  525. */
  526. .tips,
  527. .tips_block span {
  528. line-height: 25px;
  529. padding: 0 6px;
  530. }
  531. .tips {
  532. border: 1px solid #faebd2;
  533. background: #ffffe9;
  534. color: #666;
  535. }
  536. .tips_error,
  537. .tips_success {
  538. color: #cc3333;
  539. display: inline-block;
  540. line-height: 18px;
  541. }
  542. .tips_success {
  543. color: #008800;
  544. }
  545. .tips_loading {
  546. color: #333333;
  547. display: inline-block;
  548. line-height: 20px;
  549. }
  550. /*
  551. ===================
  552. loading
  553. ===================
  554. */
  555. .loading {
  556. border-radius: 16px;
  557. width: 100px;
  558. height: 30px;
  559. line-height: 30px;
  560. text-align: center;
  561. background: #000;
  562. background-color: rgba(0, 0, 0, 0.5);
  563. color: white;
  564. position: fixed;
  565. _position: absolute;
  566. left: 50%;
  567. margin-left: -50px;
  568. top: 50%;
  569. margin-top: -15px;
  570. }
  571. .loading span {
  572. background: url(../images/install_loading.gif) 0 center no-repeat;
  573. padding-left: 24px;
  574. }
  575. /*
  576. ===================
  577. 升级类型选择
  578. ===================
  579. */
  580. .updata_type {
  581. padding: 20px 30px 40px;
  582. }
  583. .updata_type .hd {
  584. font-size: 16px;
  585. }
  586. /*切换选择*/
  587. .updata_type .tab {
  588. padding-top: 10px;
  589. }
  590. .updata_type .tab li {
  591. float: left;
  592. width: 50%;
  593. display: inline;
  594. }
  595. .updata_type .tab li a {
  596. display: block;
  597. text-decoration: none;
  598. border: 1px solid #ccc;
  599. text-align: center;
  600. height: 60px;
  601. line-height: 60px;
  602. font-weight: 700;
  603. background: #fff url(../images/tab.png);
  604. color: #246EA5;
  605. font-size: 22px;
  606. font-weight: 100;
  607. }
  608. .updata_type .tab li a.fen {
  609. line-height: 50px;
  610. border-right: 0;
  611. }
  612. .updata_type .tab li a span {
  613. display: block;
  614. font-size: 12px;
  615. color: #999;
  616. line-height: 18px;
  617. margin-top: -12px;
  618. font-weight: 100;
  619. }
  620. .updata_type .tab li.current a {
  621. background: #fdfdfd;
  622. color: #6F7885;
  623. border-bottom: 1px solid #fdfdfd;
  624. }
  625. .updata_type .tab_cont {
  626. border: 1px solid #ccc;
  627. border-top: 0 none;
  628. padding: 30px;
  629. background: #fdfdfd;
  630. box-shadow: 1px 1px 1px #fff inset, -1px -1px 1px #fff inset;
  631. }
  632. .updata_type .tab_cont h3 {
  633. font-size: 16px;
  634. margin-bottom: 15px;
  635. }
  636. .updata_type .tab_cont h3 span {
  637. font-size: 12px;
  638. font-weight: 100;
  639. color: #666;
  640. }
  641. .updata_type .tab_cont h4 {
  642. font-size: 14px;
  643. }
  644. .updata_type .tab_cont h4 span {
  645. padding-left: 10px;
  646. font-size: 12px;
  647. font-weight: 100;
  648. color: #f60;
  649. }
  650. .updata_type .tab_cont ol li {
  651. margin-bottom: 10px;
  652. }
  653. .updata_type .tab_cont div {
  654. color: #666;
  655. padding-left: 20px;
  656. }
  657. .updata_type .tab_cont ul li {
  658. margin: 0;
  659. padding-left: 50px;
  660. list-style: none;
  661. color: #666;
  662. }
  663. /*立即升级*/
  664. .once_updata {
  665. text-align: center;
  666. padding: 100px 0;
  667. }
  668. .once_updata button {
  669. font-size: 32px;
  670. font-weight: 700;
  671. background: #186196 url(../images/header.png) repeat-x;
  672. color: #fff;
  673. padding: 30px 80px;
  674. font-weight: 100;
  675. font-family: "Microsoft Yahei";
  676. border: 1px solid #186196;
  677. cursor: pointer;
  678. letter-spacing: 2px;
  679. }