feat: 布局和样式调整

songxingguo · Apr 16, 2024 · 3a94ef0 · 3a94ef0
1 parent 05e6c06
commit 3a94ef0
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 11 deletions.
diff --git a/src/.vuepress/public/demo/Three/World/index.html b/src/.vuepress/public/demo/Three/World/index.html
@@ -27,7 +27,7 @@
   </head>
 
   <body>
-    <h1>three.js 进阶DEMO 展示</h1>
+    <h1>Three.js 进阶DEMO 展示</h1>
     <div class="scene-container">
       <div
         id="cube-container"

diff --git a/src/.vuepress/public/demo/Three/World/styles/main.css b/src/.vuepress/public/demo/Three/World/styles/main.css
@@ -15,17 +15,14 @@ h1 {
   width: 100%;
   /* make sure that the heading is drawn on top */
   z-index: 1;
-  margin: 40px 60px;
+  margin: 20px 0 40px;
 }
 
 .scene-container {
-  display: flex;
+  display: grid;
   justify-content: space-around;
-  flex-wrap: wrap;
-}
-
-.round {
-  border-radius: 50%;
+  grid-template-columns: repeat(auto-fill, 400px);
+  grid-gap: 10px;
 }
 
 .inline-scene {
@@ -38,7 +35,7 @@ h1 {
   height: 400px;
   overflow: hidden;
 }
-.inline-scene + .inline-scene {
-  margin-top: 20px;
-  margin-left: 20px;
+
+.round {
+  border-radius: 50%;
 }