index.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no"/>
  6. <title>优容智汇</title>
  7. <link rel="shortcut icon" href="./images/icon.png" type="image/x-icon">
  8. <link rel="stylesheet" href="./css/reset.css">
  9. <link rel="stylesheet" href="./fontsize/iconfont.css">
  10. <link rel="stylesheet" href="./css/swiper.min.css">
  11. <!-- <link rel="stylesheet" href="./css/indexPC.css" > -->
  12. <link rel="stylesheet" media="screen and (max-width:1024px)" href="./css/index.css">
  13. <link rel="stylesheet" media="screen and (min-width:1025px) " href="./css/indexPC.css">
  14. </head>
  15. <body style="font-size: 100%;">
  16. <div class="container">
  17. <div class="main">
  18. <!-- 头部 -->
  19. <div class="header">
  20. <div class="icon">
  21. <img src="./images/icon.png" alt="">
  22. </div>
  23. <div class="nav">
  24. <ul class="nav-ul">
  25. <li class="item active ">
  26. <a href="./index.html">首页</a>
  27. </li>
  28. <li class='item'>
  29. <a href="./showWork.html">作品案例</a>
  30. </li>
  31. <li class='item'>
  32. <a href="./contactUs.html">联系我们</a>
  33. </li>
  34. </ul>
  35. </div>
  36. </div>
  37. <!-- banner 视频区 -->
  38. <div class="banner">
  39. <video src="./images/showVideo.m4v" id="myvideo" loop="loop" autoplay muted webkit-playsinline playsinline
  40. preload="auto" x5-playsinline="x5-playsinline" x-webkit-airplay="true"
  41. webview.allowsInlineMediaPlayback=YES poster="./images/bannerfengmian.png">您的浏览器不支持播放该视频!</video>
  42. </div>
  43. <!-- 主题展示 -->
  44. <div class="section">
  45. <!-- 案例 -->
  46. <div class="showWork">
  47. <div class="title">
  48. <p class="top">案例<span class="iconfont icon-yuandian yuandian"></span>展示</p>
  49. </div>
  50. <div class="desc">
  51. <p class="wenan">Case demonstration</p>
  52. </div>
  53. <div class="videoshow">
  54. <div class="leftArrow">
  55. <img src="./images/leftArrow.png" alt="">
  56. </div>
  57. <div class="video-item" >
  58. <video
  59. src="http://ctop-www.oss-cn-beijing.aliyuncs.com/yourong/case/1.m4v"
  60. x5-video-player-type="h5" style="object-fit:fill" poster='./images/1.jpg'
  61. x5-playsinline="x5-playsinline" x-webkit-airplay="true" preload="auto"
  62. playsinline="true" webkit-playsinline
  63. x5-video-orientation="portraint"
  64. x-webkit-airplay='allow'
  65. class="video">您的浏览器不支持播放该视频!</video>
  66. <!-- <p class="video-title">Pwu沐浴露</p> -->
  67. <img src="./images/play.png" alt="" class="play" style="opacity: 1;">
  68. </div>
  69. <div class="video-item" >
  70. <video
  71. src="http://ctop-www.oss-cn-beijing.aliyuncs.com/yourong/case/2.m4v"
  72. x5-video-player-type="h5" style="object-fit:fill" poster='./images/2.jpg'
  73. x5-playsinline="x5-playsinline" x-webkit-airplay="true" preload="auto"
  74. x5-video-orientation="portraint"
  75. x-webkit-airplay='allow'
  76. playsinline="true" webkit-playsinline class="video">您的浏览器不支持播放该视频!</video>
  77. <!-- <p class="video-title">Usmile电动牙刷</p> -->
  78. <img src="./images/play.png" alt="" class="play" style="opacity: 1;">
  79. </div>
  80. <div class="video-item">
  81. <video
  82. src="http://ctop-www.oss-cn-beijing.aliyuncs.com/yourong/case/3.m4v"
  83. x5-video-player-type="h5" style="object-fit:fill" poster='./images/3.jpg'
  84. x5-playsinline="x5-playsinline" x-webkit-airplay="true" preload="auto"
  85. x5-video-orientation="portraint"
  86. x-webkit-airplay='allow'
  87. playsinline="true" webkit-playsinline class="video">您的浏览器不支持播放该视频!</video>
  88. <!-- <p class="video-title">花西子卸妆巾</p> -->
  89. <img src="./images/play.png" alt="" class="play" style="opacity: 1;">
  90. </div>
  91. <div class="rightArrow">
  92. <img src="./images/rightArrow.png" alt="">
  93. </div>
  94. </div>
  95. <a href="./showWork.html" class="gomore">更多案例</a>
  96. </div>
  97. <!-- 公司 -->
  98. <div class="showWork company">
  99. <div class="title">
  100. <p class="top">公司<span class="iconfont icon-yuandian yuandian"></span>概况</p>
  101. </div>
  102. <div class="desc">
  103. <p class="wenan">Company profile</p>
  104. </div>
  105. <div class="companyImg">
  106. <img src="./images/官网_58.jpg" alt="">
  107. </div>
  108. </div>
  109. <!-- 团队 -->
  110. <div class="showWork company team clearfix">
  111. <div class="title">
  112. <p class="top">团队<span class="iconfont icon-yuandian yuandian"></span>竞争力</p>
  113. </div>
  114. <div class="desc">
  115. <p class="wenan">Team competitiveness</p>
  116. </div>
  117. <div class="showicon">
  118. <div class="iconbox">
  119. <img src="./images/官网_16.png" alt="">
  120. <p>精准的创意团队</p>
  121. </div>
  122. <div class="iconbox">
  123. <img src="./images/官网_18.png" alt="">
  124. <p>资源丰富的制片团队</p>
  125. </div>
  126. <div class="iconbox">
  127. <img src="./images/官网_20.png" alt="">
  128. <p>强大的演员库</p>
  129. </div>
  130. <div class="iconbox four">
  131. <img src="./images/官网_22.png" alt="">
  132. <p>专业的摄影团队</p>
  133. </div>
  134. <div class="iconbox last">
  135. <img src="./images/官网_24.png" alt="">
  136. <p class="text">技术过硬的后期制作团队</p>
  137. </div>
  138. </div>
  139. <div class="teamImg">
  140. <img src="./images/官网_05.jpg" alt="">
  141. </div>
  142. <div class="team-bottm clearfix">
  143. <div class="clearfix">
  144. <img src="./images/yrzh3.png" alt="" class="douyin">
  145. <img src="./images/yrzh1.png" alt="" class="yrzh1">
  146. <img src="./images/yrzh2.png" alt="" class="kuaishou">
  147. <img src="./images/tip2.png" alt="" class="DYtip">
  148. <img src="./images/tip1.png" alt="" class="KStip">
  149. <!-- <span class="KStip">期望与快手官方商业化合作</span>
  150. <span class="DYtip">实现抖音官方商业化合作</span> -->
  151. </div>
  152. </div>
  153. </div>
  154. <!-- 合作客户 -->
  155. <div class="showWork company customers">
  156. <div class="title">
  157. <p class="top">合作客户</p>
  158. </div>
  159. <div class="show-customers">
  160. <div class="itembox">
  161. <img src="./images/官网_92.png" alt="">
  162. </div>
  163. <div class="itembox">
  164. <img src="./images/官网_94.png" alt="">
  165. </div>
  166. <div class="itembox">
  167. <img src="./images/官网_96.png" alt="">
  168. </div>
  169. <div class="itembox">
  170. <img src="./images/官网_98.png" alt="">
  171. </div>
  172. <div class="itembox">
  173. <img src="./images/官网_100.png" alt="">
  174. </div>
  175. <div class="itembox">
  176. <img src="./images/官网_102.png" alt="">
  177. </div>
  178. <div class="itembox">
  179. <img src="./images/官网_104.png" alt="">
  180. </div>
  181. </div>
  182. </div>
  183. <!-- 页脚部分 -->
  184. </div>
  185. </div>
  186. <div class='footer'>
  187. <div class="title">
  188. <ul>
  189. <li><span>首页</span></li>
  190. <li><span>关于我们</span></li>
  191. <li><span>服务领域</span></li>
  192. <li><span>服务能力</span></li>
  193. <li><span>合作客户</span></li>
  194. <li><span>联系我们</span></li>
  195. </ul>
  196. </div>
  197. <div class="info">
  198. <div class="box clearfix">
  199. <p class="infobox">
  200. <img src="./images/time.png" alt="">
  201. <span>AM 9:30 - PM 18:30 </span>
  202. </p>
  203. <p class="infobox chuli">
  204. <img src="./images/qq.png" alt="">
  205. <span>2015402235</span>
  206. </p>
  207. <p class="infobox email">
  208. <img src="./images/email.png" alt="">
  209. <span>tjyr@tjyourong.com.cn</span>
  210. </p>
  211. </div>
  212. <div class="box clearfix">
  213. <p class="infobox">
  214. <img src="./images/phone.png" alt="">
  215. <span>010-86467990 转 945</span>
  216. </p>
  217. <p class="infobox clear-right">
  218. <img src="./images/local.png" alt="">
  219. <span>北京市朝阳区高井文化传媒产业园东亿国际传媒产业园一期3号楼301室</span>
  220. </p>
  221. </div>
  222. <div class="box clearfix">
  223. <p class="beian">优容智汇 &copy; 版权所有 <span class="beianinfo">津ICP备20003173号</span> </p>
  224. </div>
  225. </div>
  226. </div>
  227. <a class="aside" href="#">
  228. <img src="./images/goTop.png" alt="">
  229. </a>
  230. </div>
  231. <script src="./js/phone.js"></script>
  232. <script src="./js/swiper.min.js"></script>
  233. <script src="./js/index.js"></script>
  234. <script>
  235. console.log(1)
  236. </script>
  237. </body>
  238. </html>