index.html 1.4 KB

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