list.htm 24 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857
  1. <html>
  2. <head>
  3. <meta charset="utf-8" />
  4. <title>{ms:global.name/}</title>
  5. <meta http-equiv="content-type" content="text/html" />
  6. <META HTTP-EQUIV="Pragma" CONTENT="no-cache" />
  7. <meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no,width=device-width"/>
  8. <meta name="format-detection" content="telephone=no"/>
  9. <meta name="app-mobile-web-app-capable" content="yes"/>
  10. <meta name="app-mobile-web-app-status-bar-style" content="black-translucent"/>
  11. <meta name="keywords" content="{ms:global.keyword/}" />
  12. <meta name="description" content="{ms:global.descrip/}" />
  13. <script type="text/javascript" src="{ms:global.host/}/static/plugins/vue/2.6.9/vue.min.js"></script>
  14. <link rel="stylesheet" href="{ms:global.host/}/static/plugins/minireset/0.0.2/minireset.min.css" />
  15. <link rel="stylesheet" href="https://cdn.mingsoft.net/iconfont/iconfont.css" />
  16. <link rel="stylesheet" href="{ms:global.host/}/static/plugins/animate/4.1.0/animate.min.css">
  17. <script src="{ms:global.host/}/static/plugins/element-ui/2.12.0/index.js"></script>
  18. <link rel="stylesheet" href="{ms:global.host/}/static/plugins/element-ui/2.12.0/index.css" />
  19. <link rel="stylesheet" href="{ms:global.host/}/{ms:global.style/}/css/app.css" />
  20. <!--网络请求框架-->
  21. <script src="{ms:global.host/}/static/plugins/axios/0.18.0/axios.min.js"></script>
  22. <script src="{ms:global.host/}/static/plugins/qs/6.6.0/qs.min.js"></script>
  23. <script src="{ms:global.host/}/static/plugins/ms/1.0.0/ms.js"></script>
  24. <script src="{ms:global.host/}/static/plugins/ms/1.0.0/ms.http.js"></script>
  25. <script src="{ms:global.host/}/static/plugins/ms/1.0.0/ms.util.js"></script>
  26. <script>
  27. ms.base = "";
  28. </script>
  29. <style>
  30. [v-cloak]{
  31. display: none;
  32. }
  33. </style>
  34. </head>
  35. <body>
  36. <div id="app" v-cloak>
  37. <#include "header.htm"/>
  38. <div class="ms-content">
  39. <div class="ms-channel-path">
  40. <span class="ms-channel-path-label">
  41. 当前位置:
  42. </span>
  43. <a href="/" class="ms-channel-path-index">
  44. 首页
  45. </a>
  46. {ms:channel type="path"}
  47. <i class="iconfont icon-youjiantou"></i>
  48. <a href="{ms:global.url/}${field.typelink}" class="ms-channel-path-link">
  49. ${field.typetitle}
  50. </a>
  51. {/ms:channel}
  52. </div>
  53. <div class="detail">
  54. <div class="body">
  55. <a href="${global.url}${field.typelink}"
  56. class="type-title">
  57. ${field.typetitle}
  58. </a>
  59. </div> <!--新闻列表(一行)-start-->
  60. {ms:arclist size=15 ispaging=true}
  61. <div class="ms-news-one-line">
  62. <i class="iconfont icon-fangkuai ms-news-one-line-dot" ></i>
  63. <a href="${global.url}${field.link}"
  64. class="ms-news-one-line-link">
  65. ${field.title}
  66. </a>
  67. <span class="ms-news-one-line-date" >
  68. ${field.date?string("yyyy-MM-dd")}
  69. </span>
  70. </div>
  71. {/ms:arclist} <!--新闻列表(一行)-end-->
  72. <#assign pagerCount=3 />
  73. <#assign pageCount=page.total />
  74. <#assign currentPage=page.cur />
  75. <#assign halfPagerCount=(pagerCount-1)/2/>
  76. <#assign showPrevMore=false />
  77. <#assign showNextMore=false />
  78. <#assign arr=[] />
  79. <#--判断是否有翻页-->
  80. <#if pageCount gt pagerCount>
  81. <#if currentPage gt pagerCount - halfPagerCount>
  82. <#assign showPrevMore=true />
  83. </#if>
  84. <#if currentPage lt pageCount - halfPagerCount>
  85. <#assign showNextMore=true />
  86. </#if>
  87. </#if>
  88. <#--计算页码-->
  89. <#if showPrevMore&&!showNextMore>
  90. <#assign startPage=pageCount - (pagerCount - 2) />
  91. <#list startPage..pageCount-1 as x>
  92. <#assign arr=arr+[x] />
  93. </#list>
  94. <#elseif !showPrevMore && showNextMore>
  95. <#list 2..pagerCount as x>
  96. <#assign arr=arr+[x] />
  97. </#list>
  98. <#elseif showPrevMore && showNextMore>
  99. <#assign offset=(pagerCount / 2)?floor - 1 />
  100. <#list currentPage - offset..currentPage + offset as x>
  101. <#assign arr=arr+[x] />
  102. </#list>
  103. <#else>
  104. <#list 2..pageCount as x>
  105. <#if x lt pageCount>
  106. <#assign arr=arr+[x] />
  107. </#if>
  108. </#list>
  109. </#if>
  110. <div class="ms-page">
  111. <a href="{ms:global.url/}{ms:page.pre/}">
  112. <i class="iconfont icon-zuojiantou ms-page-pre"></i>
  113. </a>
  114. <#--第一页-->
  115. <#if pageCount gt 0>
  116. <a href="{ms:global.url/}{ms:page.index/}">
  117. <#if 1==currentPage>
  118. <span class="ms-page-no-sel">1</span>
  119. <#else>
  120. <span class="ms-page-no">1</span>
  121. </#if>
  122. </a>
  123. </#if>
  124. <#--翻页的省略号-->
  125. <#if showPrevMore>
  126. <span class="ms-page-dot">
  127. ...
  128. </span>
  129. </#if>
  130. <#--中间的页码-->
  131. <#list arr as x>
  132. <a href="{ms:global.url/}${field.categoryPath}/list-${x}.html">
  133. <#if x==currentPage>
  134. <span class="ms-page-no-sel">${x}</span>
  135. <#else>
  136. <span class="ms-page-no">${x}</span>
  137. </#if>
  138. </a>
  139. </#list>
  140. <#-- 最后一页-->
  141. <#if pageCount gt 1>
  142. <a href="{ms:global.url/}${field.categoryPath}/list-${pageCount}.html">
  143. <#if pageCount==currentPage>
  144. <span class="ms-page-no-sel">${pageCount}</span>
  145. <#else>
  146. <span class="ms-page-no">${pageCount}</span>
  147. </#if>
  148. </a>
  149. </#if>
  150. <a href="{ms:global.url/}{ms:page.next/}">
  151. <i class="iconfont icon-youjiantou ms-page-next"></i>
  152. </a>
  153. <#--span>
  154. 前往
  155. <input type="number" onchange="location.href='{ms:global.url/}${field.categoryPath}/'+((this.value<=1?'index':('list-'+(this.value>${pageCount}?${pageCount}:this.value)))+'.html')">
  156. </span-->
  157. </div>
  158. </div> </div> <!--返回顶部-start-->
  159. <div class="ms-right-fixed-top">
  160. <!--内容区域-start-->
  161. <div class="content">
  162. <i class="iconfont icon-shang" ></i>
  163. <span >
  164. 回到顶部
  165. </span>
  166. </div> <!--内容区域-end-->
  167. </div> <!--返回顶部-end-->
  168. <#include "footer.htm"/>
  169. </div>
  170. </body>
  171. </html>
  172. <script>
  173. var app = new Vue({
  174. el: '#app',
  175. watch:{
  176. },
  177. data: {
  178. },
  179. methods: {
  180. switchShow:function(arr){
  181. var that = this
  182. arr.forEach(function(x){
  183. let e = that.$el.querySelector("#key_"+x)
  184. if(e){
  185. e.style.display=e.style.display=='none'?'flex':'none'
  186. }
  187. })
  188. },
  189. },
  190. created(){
  191. }
  192. })
  193. </script>
  194. <style>
  195. body {
  196. background-color:#f5f5f5;
  197. box-sizing:border-box;
  198. font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Segoe UI", "Helvetica Neue", "PingFang SC", "Noto Sans", "Noto Sans CJK SC", "Microsoft YaHei", 微软雅黑, sans-serif;
  199. moz-box-sizing:border-box;
  200. webkit-box-sizing:border-box;
  201. }
  202. .ms-content
  203. {
  204. align-items:center;
  205. flex-direction:column;
  206. display:flex;
  207. padding-right:0px;
  208. box-sizing:border-box;
  209. justify-content:center;
  210. padding-bottom:0px;
  211. flex-wrap:nowrap;
  212. width:100%;
  213. margin-bottom:0px;
  214. padding-top:0px;
  215. padding-left:0px;
  216. margin-top:0px;
  217. }
  218. .ms-content .ms-channel-path
  219. {
  220. align-items:center;
  221. flex-direction:row;
  222. display:flex;
  223. padding-right:0px;
  224. box-sizing:border-box;
  225. margin-left:auto;
  226. margin-right:auto;
  227. padding-bottom:0px;
  228. flex-wrap:nowrap;
  229. width:1170px;
  230. margin-bottom:10px;
  231. padding-top:0px;
  232. padding-left:0px;
  233. margin-top:10px;
  234. height:30px;
  235. }
  236. .ms-content .ms-channel-path .ms-channel-path-label
  237. {
  238. flex-direction:row;
  239. word-wrap:break-word;
  240. display:inline-block;
  241. font-size:14PX;
  242. margin-bottom:0px;
  243. margin-top:0px;
  244. }
  245. .ms-content .ms-channel-path .ms-channel-path-index
  246. {
  247. cursor:pointer;
  248. color:#000;
  249. font-size:14PX;
  250. text-decoration:none;
  251. margin-bottom:0px;
  252. margin-top:0px;
  253. }
  254. .ms-content .ms-channel-path >i
  255. {
  256. margin-bottom:0px;
  257. margin-top:0px;
  258. }
  259. .ms-content .ms-channel-path .ms-channel-path-link
  260. {
  261. cursor:pointer;
  262. color:#000;
  263. font-size:14PX;
  264. text-decoration:none;
  265. margin-bottom:0px;
  266. margin-top:0px;
  267. }
  268. .ms-content .detail
  269. {
  270. background-color:#FFFFFF;
  271. align-items:flex-start;
  272. flex-direction:column;
  273. display:flex;
  274. padding-right:20px;
  275. box-sizing:border-box;
  276. margin-left:0px;
  277. min-height:800px;
  278. margin-right:0px;
  279. padding-bottom:20px;
  280. flex-wrap:nowrap;
  281. width:1170px;
  282. margin-bottom:10px;
  283. padding-top:20px;
  284. position:relative;
  285. padding-left:20px;
  286. margin-top:0px;
  287. }
  288. .ms-content .detail .body
  289. {
  290. align-items:center;
  291. flex-direction:row;
  292. display:flex;
  293. padding-right:0px;
  294. box-sizing:border-box;
  295. justify-content:flex-start;
  296. margin-left:0px;
  297. margin-right:0px;
  298. padding-bottom:10px;
  299. flex-wrap:nowrap;
  300. width:100%;
  301. margin-bottom:10px;
  302. padding-top:10px;
  303. padding-left:20px;
  304. margin-top:0px;
  305. }
  306. .ms-content .detail .body .type-title
  307. {
  308. cursor:pointer;
  309. padding-bottom:0px;
  310. color:#000;
  311. font-size:18PX;
  312. text-decoration:none;
  313. margin-bottom:0px;
  314. padding-top:0px;
  315. padding-left:0px;
  316. }
  317. .ms-content .detail .ms-news-one-line
  318. {
  319. align-items:center;
  320. flex-direction:row;
  321. display:flex;
  322. padding-right:0px;
  323. box-sizing:border-box;
  324. background-position:20px center;
  325. justify-content:flex-start;
  326. margin-left:0px;
  327. margin-right:0px;
  328. padding-bottom:10px;
  329. flex-wrap:nowrap;
  330. width:100%;
  331. margin-bottom:0px;
  332. padding-top:10px;
  333. padding-left:20px;
  334. background-repeat:no-repeat;
  335. background-position-x:20px;
  336. margin-top:0px;
  337. }
  338. .ms-content .detail .ms-news-one-line .ms-news-one-line-dot
  339. {
  340. padding-bottom:0px;
  341. padding-right:0px;
  342. font-size:12PX;
  343. margin-bottom:0px;
  344. padding-top:0px;
  345. padding-left:0px;
  346. }
  347. .ms-content .detail .ms-news-one-line .ms-news-one-line-link
  348. {
  349. cursor:pointer;
  350. color:#000;
  351. padding-right:0px;
  352. text-decoration:none;
  353. margin-left:0px;
  354. margin-right:0px;
  355. padding-bottom:0px;
  356. font-size:16PX;
  357. margin-bottom:0px;
  358. padding-top:0px;
  359. padding-left:0px;
  360. background-position-x:20px;
  361. }
  362. .ms-content .detail .ms-news-one-line .ms-news-one-line-date
  363. {
  364. margin-right:10px;
  365. padding-bottom:0px;
  366. color:#9C9C9C;
  367. flex-direction:row;
  368. word-wrap:break-word;
  369. display:inline-block;
  370. font-size:14px;
  371. margin-bottom:0px;
  372. padding-top:0px;
  373. padding-left:0px;
  374. margin-left:10px;
  375. }
  376. .ms-content .detail .ms-page
  377. {
  378. align-items:center;
  379. flex-direction:row;
  380. bottom:0px;
  381. display:flex;
  382. padding-right:0px;
  383. box-sizing:border-box;
  384. justify-content:center;
  385. margin-left:0px;
  386. padding-bottom:0px;
  387. flex-wrap:nowrap;
  388. left:0px;
  389. width:100%;
  390. margin-bottom:0px;
  391. padding-top:0px;
  392. position:absolute;
  393. padding-left:0px;
  394. margin-top:0px;
  395. height:40px;
  396. }
  397. .ms-content .detail .ms-page .ms-page-pre
  398. {
  399. cursor:pointer;
  400. padding-bottom:0px;
  401. color:#000000;
  402. padding-right:0px;
  403. margin-bottom:0px;
  404. padding-top:0px;
  405. padding-left:0px;
  406. margin-top:0px;
  407. margin-left:0px;
  408. }
  409. .ms-content .detail .ms-page .ms-page-pre:hover
  410. {
  411. color:#409EFF;
  412. }
  413. .ms-content .detail .ms-page .ms-page-no
  414. {
  415. cursor:pointer;
  416. color:#000000;
  417. text-align:center;
  418. flex-direction:row;
  419. word-wrap:break-word;
  420. display:inline-block;
  421. padding-right:0px;
  422. margin-left:0px;
  423. padding-bottom:0px;
  424. width:40px;
  425. font-size:16PX;
  426. margin-bottom:0px;
  427. padding-top:0px;
  428. padding-left:0px;
  429. margin-top:0px;
  430. }
  431. .ms-content .detail .ms-page .ms-page-no:hover
  432. {
  433. color:#409EFF;
  434. }
  435. .ms-content .detail .ms-page .ms-page-no-sel
  436. {
  437. color:#409EFF;
  438. text-align:center;
  439. flex-direction:row;
  440. word-wrap:break-word;
  441. display:inline-block;
  442. width:40px;
  443. font-size:16PX;
  444. margin-top:0px;
  445. margin-left:0px;
  446. }
  447. .ms-content .detail .ms-page .ms-page-dot
  448. {
  449. text-align:center;
  450. flex-direction:row;
  451. word-wrap:break-word;
  452. display:inline-block;
  453. width:40px;
  454. font-size:16PX;
  455. margin-top:0px;
  456. margin-left:0px;
  457. }
  458. .ms-content .detail .ms-page .ms-page-next
  459. {
  460. cursor:pointer;
  461. padding-bottom:0px;
  462. color:#000000;
  463. padding-right:0px;
  464. margin-bottom:0px;
  465. padding-top:0px;
  466. padding-left:0px;
  467. margin-top:0px;
  468. margin-left:0px;
  469. }
  470. .ms-right-fixed-top
  471. {
  472. margin:0 auto;
  473. align-items:center;
  474. flex-direction:row;
  475. display:flex;
  476. padding-right:0px;
  477. box-sizing:border-box;
  478. justify-content:center;
  479. margin-left:0px;
  480. padding-bottom:0px;
  481. flex-wrap:nowrap;
  482. width:1200px;
  483. margin-bottom:0px;
  484. position:relative;
  485. padding-top:0px;
  486. padding-left:0px;
  487. margin-top:0px;
  488. height:0px;
  489. }
  490. .ms-right-fixed-top >.content
  491. {
  492. align-items:center;
  493. flex-direction:column;
  494. display:flex;
  495. padding-right:0px;
  496. box-sizing:border-box;
  497. margin-left:600px;
  498. padding-bottom:0px;
  499. top:400px;
  500. flex-wrap:nowrap;
  501. left:50%;
  502. width:40px;
  503. position:fixed;
  504. padding-top:0px;
  505. padding-left:0px;
  506. z-index:1;
  507. }
  508. .ms-right-fixed-top >.content i
  509. {
  510. padding-bottom:0px;
  511. padding-top:0px;
  512. padding-left:0px;
  513. padding-right:0px;
  514. margin-left:0px;
  515. }
  516. .ms-right-fixed-top >.content span
  517. {
  518. background-color:#909399;
  519. color:#FFFFFF;
  520. text-align:center;
  521. flex-direction:row;
  522. word-wrap:break-word;
  523. display:inline-block;
  524. padding-right:5px;
  525. margin-left:0px;
  526. padding-bottom:5px;
  527. width:50px;
  528. font-size:14px;
  529. padding-top:5px;
  530. padding-left:5px;
  531. height:40%;
  532. }
  533. @media (max-width: 768px){
  534. .ms-content
  535. {
  536. align-items:center;
  537. flex-direction:column;
  538. display:flex;
  539. padding-right:0px;
  540. box-sizing:border-box;
  541. justify-content:center;
  542. padding-bottom:0px;
  543. flex-wrap:nowrap;
  544. width:100%;
  545. margin-bottom:0px;
  546. padding-top:0px;
  547. padding-left:0px;
  548. margin-top:0px;
  549. height:unset;
  550. }
  551. .ms-content .ms-channel-path
  552. {
  553. margin-right:auto;
  554. align-items:center;
  555. flex-wrap:nowrap;
  556. flex-direction:row;
  557. display:flex;
  558. width:100%;
  559. margin-bottom:10px;
  560. box-sizing:border-box;
  561. margin-top:10px;
  562. height:30px;
  563. margin-left:auto;
  564. }
  565. .ms-content .ms-channel-path .ms-channel-path-label
  566. {
  567. font-size:14PX;
  568. flex-direction:row;
  569. word-wrap:break-word;
  570. display:inline-block;
  571. }
  572. .ms-content .ms-channel-path .ms-channel-path-index
  573. {
  574. cursor:pointer;
  575. color:#000;
  576. font-size:14PX;
  577. text-decoration:none;
  578. margin-bottom:0px;
  579. margin-top:0px;
  580. }
  581. .ms-content .ms-channel-path .ms-channel-path-link
  582. {
  583. cursor:pointer;
  584. color:#000;
  585. font-size:14PX;
  586. text-decoration:none;
  587. margin-bottom:0px;
  588. margin-top:0px;
  589. }
  590. .ms-content .detail
  591. {
  592. background-color:#FFFFFF;
  593. align-items:flex-start;
  594. flex-direction:column;
  595. display:flex;
  596. padding-right:8px;
  597. box-sizing:border-box;
  598. margin-left:0px;
  599. min-height:800px;
  600. margin-right:0px;
  601. padding-bottom:8px;
  602. flex-wrap:nowrap;
  603. width:100%;
  604. margin-bottom:10px;
  605. padding-top:8px;
  606. position:relative;
  607. padding-left:8px;
  608. margin-top:0px;
  609. }
  610. .ms-content .detail .body
  611. {
  612. align-items:center;
  613. flex-direction:row;
  614. display:flex;
  615. padding-right:0px;
  616. box-sizing:border-box;
  617. justify-content:flex-start;
  618. padding-bottom:10px;
  619. flex-wrap:nowrap;
  620. width:100%;
  621. margin-bottom:10px;
  622. padding-top:10px;
  623. padding-left:10px;
  624. margin-top:0px;
  625. }
  626. .ms-content .detail .body .type-title
  627. {
  628. cursor:pointer;
  629. padding-bottom:0px;
  630. color:#000;
  631. font-size:18PX;
  632. text-decoration:none;
  633. margin-bottom:0px;
  634. padding-top:0px;
  635. padding-left:0px;
  636. }
  637. .ms-content .detail .ms-news-one-line
  638. {
  639. align-items:center;
  640. flex-direction:row;
  641. display:flex;
  642. padding-right:0px;
  643. box-sizing:border-box;
  644. justify-content:space-between;
  645. margin-left:0px;
  646. margin-right:0px;
  647. padding-bottom:0px;
  648. flex-wrap:nowrap;
  649. width:100%;
  650. margin-bottom:0px;
  651. padding-top:0px;
  652. padding-left:0px;
  653. background-repeat:no-repeat;
  654. background-position-x:10px;
  655. margin-top:0px;
  656. }
  657. .ms-content .detail .ms-news-one-line .ms-news-one-line-dot
  658. {
  659. padding-bottom:0px;
  660. padding-right:0px;
  661. font-size:12PX;
  662. margin-bottom:0px;
  663. padding-top:0px;
  664. padding-left:0px;
  665. }
  666. .ms-content .detail .ms-news-one-line .ms-news-one-line-link
  667. {
  668. cursor:pointer;
  669. white-space:nowrap;
  670. color:#000;
  671. padding-right:0px;
  672. text-decoration:none;
  673. margin-left:0px;
  674. margin-right:0px;
  675. padding-bottom:0px;
  676. overflow:hidden;
  677. width:70%;
  678. font-size:16PX;
  679. margin-bottom:0px;
  680. padding-top:0px;
  681. text-overflow:ellipsis;
  682. padding-left:10px;
  683. background-position-x:20px;
  684. }
  685. .ms-content .detail .ms-news-one-line .ms-news-one-line-date
  686. {
  687. color:#9C9C9C;
  688. flex-direction:row;
  689. word-wrap:break-word;
  690. display:inline-block;
  691. padding-right:0px;
  692. margin-left:10px;
  693. margin-right:10px;
  694. padding-bottom:0px;
  695. font-size:14px;
  696. margin-bottom:0px;
  697. padding-top:0px;
  698. padding-left:0px;
  699. }
  700. .ms-content .detail .ms-page
  701. {
  702. align-items:center;
  703. flex-direction:row;
  704. bottom:0px;
  705. display:flex;
  706. padding-right:0px;
  707. box-sizing:border-box;
  708. justify-content:center;
  709. margin-left:0px;
  710. padding-bottom:0px;
  711. flex-wrap:nowrap;
  712. left:0px;
  713. width:100%;
  714. margin-bottom:0px;
  715. padding-top:0px;
  716. position:absolute;
  717. padding-left:0px;
  718. margin-top:0px;
  719. height:40px;
  720. }
  721. .ms-content .detail .ms-page .ms-page-pre
  722. {
  723. cursor:pointer;
  724. padding-bottom:0px;
  725. color:#000000;
  726. padding-right:0px;
  727. margin-bottom:0px;
  728. padding-top:0px;
  729. padding-left:0px;
  730. margin-top:0px;
  731. margin-left:0px;
  732. }
  733. .ms-content .detail .ms-page .ms-page-no
  734. {
  735. cursor:pointer;
  736. color:#000000;
  737. text-align:center;
  738. flex-direction:row;
  739. word-wrap:break-word;
  740. display:inline-block;
  741. padding-right:0px;
  742. margin-left:0px;
  743. padding-bottom:0px;
  744. width:40px;
  745. font-size:16PX;
  746. margin-bottom:0px;
  747. padding-top:0px;
  748. padding-left:0px;
  749. margin-top:0px;
  750. }
  751. .ms-content .detail .ms-page .ms-page-no-sel
  752. {
  753. color:#409EFF;
  754. text-align:center;
  755. flex-direction:row;
  756. word-wrap:break-word;
  757. display:inline-block;
  758. width:40px;
  759. font-size:16PX;
  760. margin-top:0px;
  761. margin-left:0px;
  762. }
  763. .ms-content .detail .ms-page .ms-page-dot
  764. {
  765. text-align:center;
  766. flex-direction:row;
  767. word-wrap:break-word;
  768. display:inline-block;
  769. width:40px;
  770. font-size:16PX;
  771. margin-top:0px;
  772. margin-left:0px;
  773. }
  774. .ms-content .detail .ms-page .ms-page-next
  775. {
  776. cursor:pointer;
  777. padding-bottom:0px;
  778. color:#000000;
  779. padding-right:0px;
  780. margin-bottom:0px;
  781. padding-top:0px;
  782. padding-left:0px;
  783. margin-top:0px;
  784. margin-left:0px;
  785. }
  786. .ms-right-fixed-top
  787. {
  788. margin:0 auto;
  789. align-items:center;
  790. flex-direction:row;
  791. display:flex;
  792. box-sizing:border-box;
  793. justify-content:center;
  794. margin-left:0px;
  795. flex-wrap:nowrap;
  796. width:100%;
  797. margin-bottom:0px;
  798. position:relative;
  799. margin-top:0px;
  800. height:0px;
  801. }
  802. .ms-right-fixed-top >.content
  803. {
  804. align-items:center;
  805. flex-direction:column;
  806. display:flex;
  807. padding-right:0px;
  808. box-sizing:border-box;
  809. margin-left:600px;
  810. padding-bottom:0px;
  811. top:400px;
  812. flex-wrap:nowrap;
  813. left:50%;
  814. width:40px;
  815. position:fixed;
  816. padding-top:0px;
  817. padding-left:0px;
  818. z-index:1;
  819. }
  820. .ms-right-fixed-top >.content i
  821. {
  822. margin-left:0px;
  823. }
  824. .ms-right-fixed-top >.content span
  825. {
  826. background-color:#909399;
  827. color:#FFFFFF;
  828. text-align:center;
  829. flex-direction:row;
  830. word-wrap:break-word;
  831. display:inline-block;
  832. padding-right:5px;
  833. margin-left:0px;
  834. padding-bottom:5px;
  835. width:50px;
  836. font-size:14px;
  837. padding-top:5px;
  838. padding-left:5px;
  839. height:40%;
  840. }
  841. }</style>