飞天AI数字人展会页面
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

76 lines
2.7 KiB

5 months ago
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  7. <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
  8. <meta http-equiv="Pragma" content="no-cache" />
  9. <meta http-equiv="Expires" content="0" />
  10. <link rel="stylesheet" type="text/css" href="css/libs/reset.css" />
  11. <link rel="stylesheet" type="text/css" href="css/libs/animate.min.css" />
  12. <link rel="stylesheet" type="text/css" href="css/plugins/gridNavigation.css" />
  13. <link rel="stylesheet" type="text/css" href="css/index.css" />
  14. <!--[if lt IE 9]>
  15. <script src="js/html5shiv.js"></script>
  16. <script src="js/respond.min.js"></script>
  17. <![endif]-->
  18. <title>视频播放</title>
  19. <style>
  20. .layer-video{
  21. height: 100%;
  22. border-radius: .1rem;
  23. overflow: hidden;
  24. }
  25. .video-header{
  26. display: flex;
  27. justify-content: space-between;
  28. align-items: center;
  29. width: calc(100% - .6rem);
  30. height: .65rem;
  31. line-height: .65rem;
  32. padding: 0 .3rem;
  33. font-family: 'PingFang';
  34. font-size: .3rem;
  35. font-weight: 500;
  36. color: #fff;
  37. background: linear-gradient( 90deg, #5B9DFF 0%, rgba(91,157,255,0) 100%);
  38. border-radius: 0.1rem .1rem 0 0;
  39. }
  40. .video-closed{
  41. display: block;
  42. width: .4rem;
  43. height: .4rem;
  44. color: #fff;
  45. background: url("images/index-img3.png") no-repeat left top;
  46. background-size: .4rem .4rem;
  47. cursor: pointer;
  48. }
  49. .video-box{
  50. padding: .3rem;
  51. width: calc(100% - .6rem);
  52. height: calc(100% - 1.25rem);
  53. background: linear-gradient( 180deg, #183375 0%, #122050 100%);
  54. }
  55. </style>
  56. </head>
  57. <body>
  58. <div class="ai-wrapper">
  59. <div class="layer-video">
  60. <div class="video-header">
  61. <h3>视频标题</h3>
  62. <span class="video-closed"></span>
  63. </div>
  64. <div class="video-box">
  65. <video id="myVideo" width="100%" height="100%" controls autoplay>
  66. <source src="media/video/elephant/重磅!大象机器人发布第二代人工智能套装,深度学习协作机器人、先进机器视觉与应用场景,人工智能实验室与职业教育必备.mp4" type="video/mp4">
  67. </video>
  68. </div>
  69. </div>
  70. </div>
  71. </body>
  72. <script type="text/javascript" src="js/libs/jquery-3.7.1.min.js"></script>
  73. <script type="text/javascript" src="js/libs/flexible.js"></script>
  74. <!-- 模块切换 -->
  75. <script type="text/javascript" src="js/index.js"></script>
  76. </html>