style: 修复web端页面无法滚动问题

pages/CSS/transform/rotate.uvue

 <template>
-  <!-- #ifdef APP -->
   <scroll-view class="page">
-  <!-- #endif -->
-    <view class="rotate-container">
     <view class="trace">
       <view class="base reserve">
         <text class="reserve-text">rotate(20deg)</text>
@@ -38,21 +35,12 @@
       <text>rotateZ(50deg)</text>
       <text>转变后位置</text>
     </view>
-
-    </view>
-  <!-- #ifdef APP -->
   </scroll-view>
-  <!-- #endif -->
 </template>
 
 <style>
   .page {
     flex: 1;
-  }
-
-  .rotate-container {
-    height: 100%;
-    display: flex;
     align-items: center;
   }
 
@@ -74,15 +62,15 @@
 
   .reserve {
     border: 1px dotted #588;
-    background-color: #DDD;
+    background-color: #ddd;
   }
 
   .reserve-text {
-    color: #CCC;
+    color: #ccc;
   }
 
   .transform {
-    border: 1px solid #00F;
+    border: 1px solid #00f;
     background-color: rgba(0, 255, 255, 0.5);
   }
 </style>

pages/CSS/transform/translate.uvue

 <template>
-  <!-- #ifdef APP -->
   <scroll-view class="page">
-  <!-- #endif -->
-    <view class="translate-container">
     <view class="trace">
       <view class="base reserve">
         <text class="reserve-text">translateX(80%)</text>
@@ -30,20 +27,12 @@
       <text>translate(-50%,50%)</text>
       <text>转变后位置</text>
     </view>
-    </view>
-  <!-- #ifdef APP -->
   </scroll-view>
-  <!-- #endif -->
 </template>
 
 <style>
   .page {
     flex: 1;
-  }
-
-  .translate-container{
-    height: 100%;
-    display: flex;
     align-items: center;
   }