Brak opisu

index_centen.html 4.3KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title></title>
  6. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  7. <link href="../css/mui.min.css" rel="stylesheet" />
  8. <link href="../css/app.css" rel="stylesheet" />
  9. <link href="../css/iconfont.css" rel="stylesheet" />
  10. </head>
  11. <body>
  12. <!-- 主页面内容容器 -->
  13. <div class="mui-content mui-scroll-wrapper" id="pullrefresh" >
  14. <div class="mui-scroll">
  15. <!-- 主界面具体展示内容 -->
  16. <!--图片轮播-->
  17. <div id="slider" class="mui-slider">
  18. <div class="mui-slider-group mui-slider-loop">
  19. <!-- 额外增加的一个节点(循环轮播:第一个节点是最后一张轮播) -->
  20. <div class="mui-slider-item mui-slider-item-duplicate">
  21. <a>
  22. <img src="../images/banner/4.jpg">
  23. </a>
  24. </div>
  25. <!-- 第一张 -->
  26. <div class="mui-slider-item">
  27. <a>
  28. <img src="../images/banner/1.jpg">
  29. </a>
  30. </div>
  31. <!-- 第二张 -->
  32. <div class="mui-slider-item">
  33. <a>
  34. <img src="../images/banner/2.jpg">
  35. </a>
  36. </div>
  37. <!-- 第三张 -->
  38. <div class="mui-slider-item">
  39. <a>
  40. <img src="../images/banner/3.jpg">
  41. </a>
  42. </div>
  43. <!-- 第四张 -->
  44. <div class="mui-slider-item">
  45. <a>
  46. <img src="../images/banner/4.jpg">
  47. </a>
  48. </div>
  49. <!-- 额外增加的一个节点(循环轮播:最后一个节点是第一张轮播) -->
  50. <div class="mui-slider-item mui-slider-item-duplicate">
  51. <a>
  52. <img src="../images/banner/1.jpg">
  53. </a>
  54. </div>
  55. </div>
  56. <div class="mui-slider-indicator">
  57. <div class="mui-indicator mui-active"></div>
  58. <div class="mui-indicator"></div>
  59. <div class="mui-indicator"></div>
  60. <div class="mui-indicator"></div>
  61. </div>
  62. </div>
  63. <!-- 九宫格排版-->
  64. <div class="mui-card-content conblock">
  65. <div class="maintitbox">
  66. <div class="maintit">热门领域</div>
  67. </div>
  68. <ul class="mui-table-view mui-grid-view mui-grid-9 gridbg">
  69. <li class="mui-table-view-cell mui-media mui-col-xs-4" data-title="材料失效与保护">
  70. <a>
  71. <div class="fieldicon">
  72. <img src="../images/field_icon/field05.png" />
  73. </div>
  74. <div class="mui-media-body">材料失效与保护</div>
  75. </a>
  76. </li>
  77. <li class="mui-table-view-cell mui-media mui-col-xs-4" data-title="材料表面与界面">
  78. <a>
  79. <div class="fieldicon">
  80. <img src="../images/field_icon/field02.png" />
  81. </div>
  82. <div class="mui-media-body">材料表面与界面</div>
  83. </a>
  84. </li>
  85. <li class="mui-table-view-cell mui-media mui-col-xs-4" data-title="黑色金属及其合金">
  86. <a>
  87. <div class="fieldicon">
  88. <img src="../images/field_icon/field07.png" />
  89. </div>
  90. <div class="mui-media-body">黑色金属及其合金</div>
  91. </a>
  92. </li>
  93. <li class="mui-table-view-cell mui-media mui-col-xs-4" data-title="金属材料">
  94. <a>
  95. <div class="fieldicon">
  96. <img src="../images/field_icon/field18.png" />
  97. </div>
  98. <div class="mui-media-body">金属材料</div>
  99. </a>
  100. </li>
  101. <li class="mui-table-view-cell mui-media mui-col-xs-4" data-title="有色金属及其合金">
  102. <a>
  103. <div class="fieldicon">
  104. <img src="../images/field_icon/field04.png" />
  105. </div>
  106. <div class="mui-media-body">有色金属及其合金</div>
  107. </a>
  108. </li>
  109. <li class="mui-table-view-cell mui-media mui-col-xs-4" data-title="材料检测与分析技术">
  110. <a>
  111. <div class="fieldicon">
  112. <img src="../images/field_icon/field16.png" />
  113. </div>
  114. <div class="mui-media-body">材料检测与分析技术</div>
  115. </a>
  116. </li>
  117. </ul>
  118. </div>
  119. <!--图文列表-->
  120. <div class="mui-card-content conblock">
  121. <div class="maintitbox">
  122. <div class="maintit">热门专家</div>
  123. </div>
  124. <!--数据列表-->
  125. <ul class="mui-table-view mui-table-view-chevron list">
  126. </ul>
  127. </div>
  128. </div>
  129. </div>
  130. <script src="../js/public/mui.min.js"></script>
  131. <script src="../js/public/base.js"></script>
  132. <script src="../js/index.js"></script>
  133. </body>
  134. </html>