index.html 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507
  1. <!DOCTYPE html>
  2. <!--[if lt IE 7]> <html lang="en" class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
  3. <!--[if IE 7]> <html lang="en" class="no-js lt-ie9 lt-ie8"> <![endif]-->
  4. <!--[if IE 8]> <html lang="en" class="no-js lt-ie9"> <![endif]-->
  5. <!--[if gt IE 8]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
  6. <head>
  7. <!-- meta character set -->
  8. <meta charset="utf-8">
  9. <!-- Always force latest IE rendering engine or request Chrome Frame -->
  10. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  11. <title>Blue Pro</title>
  12. <!-- Meta Description -->
  13. <meta name="description" content="Blue One Page Creative HTML5 Template">
  14. <meta name="keywords" content="one page, single page, onepage, responsive, parallax, creative, business, html5, css3, css3 animation">
  15. <meta name="author" content="Themefisher">
  16. <!-- Mobile Specific Meta -->
  17. <meta name="viewport" content="width=device-width, initial-scale=1">
  18. <!-- CSS
  19. ================================================== -->
  20. <!--<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,700">-->
  21. <!-- Ion Icons Font -->
  22. <link rel="stylesheet" href="css/ionicons.min.css">
  23. <!-- bootstrap.min -->
  24. <link rel="stylesheet" href="css/jquery.fancybox.css">
  25. <!-- bootstrap.min -->
  26. <link rel="stylesheet" href="css/bootstrap.min.css">
  27. <!-- bootstrap.min -->
  28. <link rel="stylesheet" href="css/owl.carousel.css">
  29. <!-- bootstrap.min -->
  30. <link rel="stylesheet" href="css/slit-slider.css">
  31. <!-- bootstrap.min -->
  32. <link rel="stylesheet" href="css/animate.css">
  33. <!-- Main Stylesheet -->
  34. <link rel="stylesheet" href="css/main.css">
  35. <!-- Modernizer Script for old Browsers -->
  36. <script src="js/modernizr-2.6.2.min.js"></script>
  37. </head>
  38. <body id="body">
  39. <!-- preloader -->
  40. <div id="preloader">
  41. <div class="loder-box">
  42. <div class="battery"></div>
  43. </div>
  44. </div>
  45. <!-- end preloader -->
  46. <!--
  47. Fixed Navigation
  48. ==================================== -->
  49. <header id="navigation" class="navbar-inverse navbar-fixed-top animated-header">
  50. <div class="container">
  51. <div class="navbar-header">
  52. <!-- responsive nav button -->
  53. <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
  54. <span class="sr-only">Toggle navigation</span>
  55. <span class="icon-bar"></span>
  56. <span class="icon-bar"></span>
  57. <span class="icon-bar"></span>
  58. </button>
  59. <!-- /responsive nav button -->
  60. <!-- logo -->
  61. <h1 class="navbar-brand">
  62. <a href="#body">
  63. <img class="logo-img" src="./img/assets/dalogo3x.png" alt="">
  64. <!-- <img src="./img/assets/logo.png" alt=""><span>企云服</span> -->
  65. </a>
  66. </h1>
  67. <!-- /logo -->
  68. </div>
  69. <!-- main nav -->
  70. <nav class="collapse navbar-collapse navbar-right" role="navigation">
  71. <ul id="nav" class="nav navbar-nav menu">
  72. <li><a href="#body"><span>首页</span></a></li>
  73. <li><a href="#feature"><span>特色</span></a></li>
  74. <li><a href="#service"><span>功能</span></a></li>
  75. <li><a href="#prototype"><span>帮助中心</span></a></li>
  76. <li><a href="#footer"><span>联系我们</span></a></li>
  77. </li>
  78. <li class="login">
  79. <span class="btn1"><img src="./img/assets/denglu3x.png" alt="">登录 &nbsp;</span>
  80. <span class="register"><img src="./img/assets/zhuce3x.png" alt="">注册</span>
  81. </li>
  82. <li class="profile" style="display:none">
  83. <span class="user-info">
  84. <img src="./img/assets/denglu3x.png" alt="">
  85. <span id="user-info"></span>
  86. </span>|
  87. <a href="#">账户管理</a>
  88. </li>
  89. </ul>
  90. </nav>
  91. <!-- /main nav -->
  92. </header>
  93. <!--End Fixed Navigation==================================== -->
  94. <main class="site-content" role="main">
  95. <!-- 遮罩 -->
  96. <div class="zhezhao"></div>
  97. <div id="box" class="box">
  98. <iframe width="346" height="511"></iframe>
  99. </div>
  100. <section id="home-slider">
  101. <div id="slider" class="sl-slider-wrapper">
  102. <div class="sl-slider">
  103. <div class="sl-slide" data-orientation="horizontal" data-slice1-rotation="-25" data-slice2-rotation="-25" data-slice1-scale="2" data-slice2-scale="2">
  104. <div class="mask-overly"></div>
  105. <div class="bg-img slider-1">
  106. </div>
  107. <!-- 首页内容 -->
  108. <div class="my-text">
  109. <!-- <img class="sy-dianzi sy-mb" src="./img/assets/dianzi3x.png" alt="">
  110. <div class="sy-mb">
  111. <img src="./img/assets/xun3x.png" alt="">
  112. <img class='sy-mbimg2' src="./img/assets/jin3x.png" alt="">
  113. </div>
  114. <div class="sy-mb">
  115. <img src="./img/assets/ren3x.png" alt="">
  116. <img src="./img/assets/zi3x.png" alt="">
  117. </div>
  118. <div class="sy-mb">
  119. <img src="./img/assets/Group3x.png" alt="">
  120. <img src="./img/assets/qing3x.png" alt="">
  121. </div> -->
  122. <button class='my-tiyan'>立即体验</button>
  123. </div>
  124. <!-- <div class="sy-img"><img class="chrw" src="./img/assets/chatu.png" alt=""></div> -->
  125. <div class="slide-caption">
  126. <div class="caption-content"></div>
  127. </div>
  128. </div>
  129. </div>
  130. </div>
  131. </section>
  132. <!-- End Home SliderEnd==================================== -->
  133. <!-- 特色 -->
  134. <section id="feature">
  135. <div class="container ts-worp">
  136. <div class="section-title text-center">
  137. <p class="ts-title">我们的特色</p>
  138. <p class="ts-text">云端部署 &nbsp;&nbsp; 轻量应用</p>
  139. </div>
  140. <div class="ts-box">
  141. <div style="margin:50px 0;">
  142. <img class="ts-img" src="img/features.jpg" alt="">
  143. </div>
  144. <div class="right right-text">
  145. <img class="ts-minimg" src="./img/assets/1.png" alt="">
  146. <div class="ts-mintext">
  147. <p><img class="ts-textimg" src="./img/assets/xunzhao@2x.png" alt="">迅速找到您想要的</p>
  148. <p>寻找供应商资源</p>
  149. <p>寻找产品货源 寻找产品资料</p>
  150. </div>
  151. </div>
  152. </div>
  153. <div class="ts-box">
  154. <div class="left left-text">
  155. <img class="ts-minimg" style="left:0;" src="./img/assets/2.png" alt="">
  156. <div class="ts-mintext ts-lefttext">
  157. <p>直观看到您想看的<img class="ts-textleftimg" src="./img/assets/fen xi@2x.png" alt=""></p>
  158. <p>每日订单量、收付款、月度销售分析、采购分析</p>
  159. <p>让你成为企业经营老司机</p>
  160. </div>
  161. </div>
  162. <div style="margin:50px 0;">
  163. <img class="ts-img" src="img/features.jpg" alt="">
  164. </div>
  165. </div>
  166. <div class="ts-box">
  167. <div style="margin:50px 0;">
  168. <img class="ts-img" src="img/features.jpg" alt="">
  169. </div>
  170. <div class="right right-text">
  171. <img class="ts-minimg" src="./img/assets/1.png" alt="">
  172. <div class="ts-mintext" style="right: 145px;">
  173. <p><img class="ts-textimg" src="./img/assets/kuaisu@2x.png" alt="">快速上手 生意简单做</p>
  174. <p>移动端的交互体验</p>
  175. <p>简短清晰的业务流程 让你三分钟上手</p>
  176. </div>
  177. </div>
  178. </div>
  179. </div>
  180. </section>
  181. <!-- Service section 功能-->
  182. <section id="service">
  183. <div class="container" style="position: relative;">
  184. <img class="gn-beijing" src="./img/gongneng/xu xian@3x.png" alt="">
  185. <div class="row">
  186. <div class="section-title text-center">
  187. <p class="ts-title">我们的功能</p>
  188. </div>
  189. <div class="gn-hei">
  190. <div class="col-md-3 col-sm-6 col-xs-12">
  191. <div class="service-item">
  192. <p class="gn-text gn-color">任务管理</p>
  193. <p>任务分配,高效工作</p>
  194. <p>管好每一件事</p>
  195. <div class="gn-img">
  196. <img src="./img/gongneng/ren wu 1@3x.png" alt="">
  197. </div>
  198. </div>
  199. </div>
  200. <div class="col-md-3 col-sm-6 col-xs-12">
  201. <div class="service-item">
  202. <p class="gn-text">资源管理</p>
  203. <p>一键查询,海量供应商产品信息</p>
  204. <p>节约时间</p>
  205. <div class="gn-img gn-huise">
  206. <img src="./img/gongneng/zi yuan 2@3x.png" alt="">
  207. </div>
  208. </div>
  209. </div>
  210. <div class="col-md-3 col-sm-6 col-xs-12">
  211. <div class="service-item">
  212. <p class="gn-text">销售管理</p>
  213. <p>快速制单</p>
  214. <p>利润实时算</p>
  215. <div class="gn-img">
  216. <img src="./img/gongneng/ xiao shou 3@3x.png" alt="">
  217. <div class="gn-xiaoqiu"></div>
  218. </div>
  219. </div>
  220. </div>
  221. <div class="col-md-3 col-sm-6 col-xs-12">
  222. <div class="service-item">
  223. <p class="gn-text">采购管理</p>
  224. <p>寻源.定价.采购</p>
  225. <p>一条流程</p>
  226. <div class="gn-img gn-huise">
  227. <img src="./img/gongneng/cai gou 4@3x.png" alt="">
  228. </div>
  229. </div>
  230. </div>
  231. <div class="col-md-3 col-sm-6 col-xs-12">
  232. <div class="service-item">
  233. <div class="gn-img gn-huise">
  234. <img src="./img/gongneng/cang ku 5@3x.png" alt="">
  235. <div class="gn-xiaoqiu"></div>
  236. </div>
  237. <p class="gn-text">仓库管理</p>
  238. <p>库存盘点,库存账龄</p>
  239. <p>呆滞分析</p>
  240. </div>
  241. </div>
  242. <div class="col-md-3 col-sm-6 col-xs-12">
  243. <div class="service-item">
  244. <div class="gn-img">
  245. <img src="./img/gongneng/jia gong 6@3x.png" alt="">
  246. </div>
  247. <p class="gn-text">加工管理</p>
  248. <p>BOM成本及时看</p>
  249. <p>加工单自动出入库作业</p>
  250. </div>
  251. </div>
  252. <div class="col-md-3 col-sm-6 col-xs-12">
  253. <div class="service-item">
  254. <div class="gn-img gn-huise">
  255. <img src="./img/gongneng/QIAN BAO 7@3x.png" alt="">
  256. </div>
  257. <p class="gn-text">资金管理</p>
  258. <p>清晰核算</p>
  259. <p>实时查看供应商和客户账款情况</p>
  260. </div>
  261. </div>
  262. <div class="col-md-3 col-sm-6 col-xs-12">
  263. <div class="service-item">
  264. <div class="gn-img">
  265. <img src="./img/gongneng/FEN XI 8@3x.png" alt="">
  266. <div class="gn-xiaoqiu gn-left"></div>
  267. </div>
  268. <p class="gn-text gn-color">智能分析</p>
  269. <p>直观数据看板,看库存分析</p>
  270. <p>收款分析,付款分析</p>
  271. </div>
  272. </div>
  273. </div>
  274. </div>
  275. </div>
  276. </section>
  277. <!-- end Service section -->
  278. <!-- 帮助中心 -->
  279. <section id="prototype">
  280. <div class="container">
  281. <div class="row">
  282. <div class="section-title text-center">
  283. <p class="ts-title">帮助中心</p>
  284. </div>
  285. <div class="bz-worp">
  286. <div class="bz-box">
  287. <div class="bz-sskuang">
  288. <span><img class="bz-sousuoimg" src="./img/assets/sou.png" alt=""></span>
  289. <input class="bz-sousuo" type="text" placeholder="输入标题搜索"/>
  290. </div>
  291. <button class="bz-btn">搜索</button>
  292. </div>
  293. <div class="bz-content">
  294. <div class="bz-left">
  295. <ul class="bz-ul">
  296. <li class='active'>操作文档</li>
  297. <li>常见问题</li>
  298. </ul>
  299. </div>
  300. <div class="bz-right">
  301. <div class="bz-right-conent">
  302. <div>
  303. <ul>
  304. <li>
  305. <span class="left bz-yuandian"></span>
  306. <span class="left">方式不同吧好像是差不多哇来访黑哇哦发检测句ID回复开展了好xxxxx操作文档 </span>
  307. <span class="right">2018年10月31日 12:00</span>
  308. </li>
  309. <li>
  310. <span class="left bz-yuandian"></span>
  311. <span class="left">XXXXXXXXXXXXXXX操作文档</span>
  312. <span class="right">2018年10月31日 12:00</span>
  313. </li>
  314. <li>
  315. <span class="left bz-yuandian"></span>
  316. <span class="left">XXXXXXXXXXXXXXX操作文档</span>
  317. <span class="right">2018年10月31日 12:00</span>
  318. </li>
  319. </ul>
  320. </div>
  321. <div>
  322. <ul>
  323. <li>
  324. <span class="left bz-yuandian"></span>
  325. <span class="left">方式不同吧好像是差不多哇来访黑哇哦发检测句ID回复开展了好xxxxx常见问题 </span>
  326. <span class="right">2018年10月31日 12:00</span>
  327. </li>
  328. <li>
  329. <span class="left bz-yuandian"></span>
  330. <span class="left">方式不同吧好像是差不多哇来访黑哇哦发检测句ID回复开展了好xxxxx常见问题</span>
  331. <span class="right">2018年10月31日 12:00</span>
  332. </li>
  333. <li>
  334. <span class="left bz-yuandian"></span>
  335. <span class="left">XXXXXXXXXXXXXXX常见问题</span>
  336. <span class="right">2018年10月31日 12:00</span>
  337. </li>
  338. </ul>
  339. </div>
  340. </div>
  341. </div>
  342. </div>
  343. </div>
  344. </div>
  345. </div>
  346. </section>
  347. <!-- Contact section -->
  348. <!-- <section id="contact" >
  349. <div class="container">
  350. <div class="row">
  351. <div class="section-title text-center">
  352. <h2>Contact</h2>
  353. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloribus, <br> sapiente. Libero ipsam, dolore quibusdam magni.</p>
  354. </div>
  355. <div class="col-md-7 contact-form">
  356. <form id="contact-form" action="#" method="post">
  357. <div class="input-field">
  358. <input type="text" name="name" class="form-control" placeholder="Your Name...">
  359. </div>
  360. <div class="input-field">
  361. <input type="email" name="email" class="form-control" placeholder="Your Email...">
  362. </div>
  363. <div class="input-field">
  364. <input type="text" name="subject" class="form-control" placeholder="Subject...">
  365. </div>
  366. <div class="input-field">
  367. <textarea name="message" class="form-control" placeholder="Messages..."></textarea>
  368. </div>
  369. <button type="submit" id="submit" class="btn btn-blue btn-effect">Send</button>
  370. </form>
  371. </div>
  372. <div class="col-md-5">
  373. <address class="contact-details">
  374. <h3>Our Address</h3>
  375. <p><i class="ion-ios-home-outline"></i>Phoenix Inc.<span>PO Box 345678</span> <span>Little Lonsdale St, Melbourne </span><span>Australia</span></p><br>
  376. <p><i class="ion-ios-telephone-outline"></i>Phone: (415) 124-5678 </p>
  377. <p><i class="ion-ios-email-outline"></i>website@yourname.com</p>
  378. </address>
  379. </div>
  380. </div>
  381. </div>
  382. </section> -->
  383. <!-- end Contact section -->
  384. </main>
  385. <!-- 底部 ------------------------------------------------>
  386. <!--footer begin-->
  387. <div class="footer footer-section">
  388. <div class="container">
  389. <div class="footer-list">
  390. <div class="about">
  391. <div class="logo"><img src="./img/logo_w.png" alt=""/></div>
  392. <div class="time">客服热线:400-830-1818</div>
  393. <div class="time">工作时间:周一至周五08:30~18:00</div>
  394. <!--<div class="time">意见反馈:usoftmall.com</div>-->
  395. </div>
  396. <div class="link">
  397. <ul>
  398. <li><span>帮助中心</span></li>
  399. <li><a href="#">常见问题</a></li>
  400. <li><a href="#">操作手册</a></li>
  401. </ul>
  402. <ul>
  403. <li><span>公司</span></li>
  404. <li><a href="#">关于我们</a></li>
  405. <li><a href="#">企业文化</a></li>
  406. <li><a href="https://www.usoftchina.com/contact">联系我们</a></li>
  407. </ul>
  408. <!-- <ul>
  409. <li><span>闯客网</span></li>
  410. <li><a href="https://www.uuzcc.com/article/detail/13260.html">需求发布流程</a></li>
  411. <li><a href="https://www.uuzcc.com/article/detail/13457.html">认证流程</a></li>
  412. <li><a href="https://www.uuzcc.com/article/detail/13456.html">服务商规则</a></li>
  413. </ul> -->
  414. <ul>
  415. <li><span>产品</span></li>
  416. <li><a class="no-link">u企云服</a></li>
  417. <li><a class="no-link">u软商城</a></li>
  418. <li><a href="#">u智融</a></li>
  419. <li><a href="#">u创客</a></li>
  420. </ul>
  421. </div>
  422. <div class="qr">
  423. <div class="qr-top">
  424. <div class="qr-tech qr-code">
  425. <img src="./img/qr-tech.png" alt="">
  426. <div class="db-text">
  427. <span>科技公众号</span>
  428. </div>
  429. </div>
  430. <!-- <div class="qr-mall qr-code">
  431. <img src="./img/qr_mall.jpg" alt="">
  432. 商城公众号
  433. </div> -->
  434. </div>
  435. <!-- <div class="qr-bottom">
  436. 粤ICP备15112126号
  437. <br/>2018 © 深圳市优软科技有限公司
  438. </div> -->
  439. </div>
  440. </div>
  441. </div>
  442. </div>
  443. <div class="friend-link">
  444. <ul>
  445. <li><span>常用链接:</span></li>
  446. <li><a href="#">uas官网</a></li>
  447. <li><a href="#">u软云</a></li>
  448. <li><a href="#">英唐官网</a></li>
  449. </ul>
  450. </div>
  451. <!--footer end-->
  452. <!-- Essential jQuery Plugins
  453. ================================================== -->
  454. <!-- Main jQuery -->
  455. <script src="js/jquery-1.11.1.min.js"></script>
  456. <!-- Twitter Bootstrap -->
  457. <script src="js/bootstrap.min.js"></script>
  458. <!-- Single Page Nav -->
  459. <script src="js/jquery.singlePageNav.min.js"></script>
  460. <!-- jquery.fancybox.pack -->
  461. <script src="js/jquery.fancybox.pack.js"></script>
  462. <!-- Owl Carousel -->
  463. <script src="js/owl.carousel.min.js"></script>
  464. <!-- jquery easing -->
  465. <script src="js/isotope.pkgd.min.js"></script>
  466. <script src="js/jquery.easing.min.js"></script>
  467. <!-- Fullscreen slider -->
  468. <script src="js/jquery.slitslider.js"></script>
  469. <script src="js/jquery.ba-cond.min.js"></script>
  470. <!-- onscroll animation -->
  471. <script src="js/wow.min.js"></script>
  472. <!-- socket -->
  473. <script src="js/sockjs.min.js"></script>
  474. <script src="js/stomp.min.js"></script>
  475. <!-- Custom Functions jq表单提交插件-->
  476. <!-- <script src="js/jquery.form.min.js"></script> -->
  477. <!-- <script src="js/jquery.validate.min.js"></script> -->
  478. <script src="js/main.js"></script>
  479. </body>
  480. </html>