index.html 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. <!doctype html>
  2. <html lang="zh">
  3. <head>
  4. <meta charset="utf-8" />
  5. <meta
  6. name="viewport"
  7. content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
  8. />
  9. <title>四维时代</title>
  10. <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" />
  11. <style>
  12. * {
  13. margin: 0;
  14. padding: 0;
  15. box-sizing: border-box;
  16. }
  17. canvas {
  18. touch-action: none;
  19. /* 禁用浏览器默认触摸行为 */
  20. }
  21. body {
  22. background-color: #ccc;
  23. }
  24. .loadingBox {
  25. position: absolute;
  26. width: 90%;
  27. max-width: 1200px;
  28. height: 6px;
  29. border-radius: 3px;
  30. border: 1px solid #2dc0ef;
  31. top: 50%;
  32. left: 50%;
  33. transform: translate(-50%, -50%);
  34. opacity: 1;
  35. pointer-events: auto;
  36. transition: all 0.5s;
  37. }
  38. #loading {
  39. position: absolute;
  40. top: 0;
  41. left: 0;
  42. width: 0;
  43. height: 100%;
  44. background-color: #2dc0ef;
  45. }
  46. /* @media screen and (max-width: 1000px) {
  47. .loadingBox {
  48. height: 10px;
  49. border-radius: 5px;
  50. }
  51. } */
  52. .errBox {
  53. position: fixed;
  54. z-index: 9999;
  55. width: 100%;
  56. height: 100%;
  57. justify-content: center;
  58. align-items: center;
  59. letter-spacing: 4px;
  60. font-size: 16px;
  61. display: none;
  62. background-color: #cccccc;
  63. }
  64. </style>
  65. </head>
  66. <body>
  67. <script></script>
  68. <div class="loadingBox">
  69. <div id="loading"></div>
  70. </div>
  71. <script type="module" src="./js/main.js"></script>
  72. <div class="errBox"></div>
  73. </body>
  74. <!--
  75. <script>
  76. window.onload = function () {
  77. var script = document.createElement('script')
  78. script.src = 'http://cdn.bootcss.com/eruda/1.5.4/eruda.min.js'
  79. document.body.appendChild(script)
  80. script.onload = function () {
  81. eruda.init()
  82. }
  83. }
  84. </script> -->
  85. </html>