index.html 2.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
  1. <!doctype html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <link rel="icon" href="./favicon.ico" />
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  7. <meta name="renderer" content="webkit" />
  8. <meta name="force-rendering" content="webkit" />
  9. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  10. <meta name="description" content="ppt编辑器" />
  11. <meta name="keywords" content="ppt,powerpoint,office powerpoint,在线ppt,幻灯片,演示文稿,ppt在线制作,Vue3,TypeScript" />
  12. <title>PPT</title>
  13. <script type="module" crossorigin src="./assets/index-C6hYkiiF.js"></script>
  14. <link rel="stylesheet" crossorigin href="./assets/index-BrUV76Xx.css">
  15. </head>
  16. <body>
  17. <div id="app">
  18. <style>
  19. .firstLoading {
  20. position: fixed;
  21. left: 0;
  22. top: 0;
  23. right: 0;
  24. bottom: 0;
  25. width: 100%;
  26. height: 100%;
  27. min-width: 100vw;
  28. min-height: 100vh;
  29. display: flex;
  30. flex-direction: column;
  31. justify-content: center;
  32. align-items: center;
  33. z-index: 10000;
  34. }
  35. .firstLoading .loadingBox {
  36. width: 36px;
  37. height: 36px;
  38. display: flex;
  39. justify-content: space-between;
  40. flex-wrap: wrap;
  41. align-content: space-between;
  42. margin-bottom: 28px;
  43. animation: rotate 1.5s linear infinite;
  44. }
  45. .firstLoading .loadingBox .loadingItem {
  46. width: 16px;
  47. height: 16px;
  48. border-radius: 50%;
  49. background: #569cfe;
  50. opacity: 0.5;
  51. }
  52. .firstLoading .loadingBox .loadingItem:nth-child(2) {
  53. opacity: 1;
  54. }
  55. .firstLoading .loadingTip {
  56. font-size: 20px;
  57. color: #569cfe;
  58. }
  59. @keyframes rotate {
  60. from {
  61. transform: rotate(0deg);
  62. }
  63. to {
  64. transform: rotate(360deg);
  65. }
  66. }
  67. </style>
  68. <div class="firstLoading">
  69. <div class="loadingBox">
  70. <div class="loadingItem"></div>
  71. <div class="loadingItem"></div>
  72. <div class="loadingItem"></div>
  73. <div class="loadingItem"></div>
  74. </div>
  75. <div class="loadingTip">正在加载中…</div>
  76. </div>
  77. </div>
  78. </body>
  79. <script>
  80. document.oncontextmenu = e => e.preventDefault()
  81. </script>
  82. </html>