From a332ecc582fa0b38b67b350c4bbdb93e6f69db01 Mon Sep 17 00:00:00 2001
From: wanganxp <wanganxp@gmail.com>
Date: Sat, 1 Jun 2024 07:17:09 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A1=A5=E5=85=85css=E7=9A=840.5px=E7=A4=BA?=
 =?UTF-8?q?=E4=BE=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/CSS/transform/scale.uvue | 142 ++++++++++++++++++---------------
 1 file changed, 77 insertions(+), 65 deletions(-)

diff --git a/pages/CSS/transform/scale.uvue b/pages/CSS/transform/scale.uvue
index 72c97b82..9fbed2b9 100644
--- a/pages/CSS/transform/scale.uvue
+++ b/pages/CSS/transform/scale.uvue
@@ -1,74 +1,86 @@
 <template>
-<scroll-view class="page">
-	<view class="trace">
-		<view class="base reserve">
-			<text class="reserve-text">scaleX(0.6)</text>
-			<text class="reserve-text">转变前位置</text>
-		</view>
-		<view class="base reserve">
-			<text class="reserve-text">scaleY(0.8)</text>
-			<text class="reserve-text">转变前位置</text>
-		</view>
-		<view class="base reserve">
-			<text class="reserve-text">scale(0.8,0.8)</text>
-			<text class="reserve-text">转变前位置</text>
-		</view>
-	</view>
+  <scroll-view class="page">
+    <view class="trace">
+      <view class="base reserve">
+        <text class="reserve-text">scaleX(0.6)</text>
+        <text class="reserve-text">转变前位置</text>
+      </view>
+      <view class="base reserve">
+        <text class="reserve-text">scaleY(0.8)</text>
+        <text class="reserve-text">转变前位置</text>
+      </view>
+      <view class="base reserve">
+        <text class="reserve-text">scale(0.8,0.8)</text>
+        <text class="reserve-text">转变前位置</text>
+      </view>
+    </view>
 
-	<view class="base transform" style="transform: scaleX(0.6)">
-		<text>scaleX(0.6)</text>
-		<text>转变后位置</text>
-	</view>
-	<view class="base transform" style="transform: scaleY(0.6)">
-		<text>scaleY(0.6)</text>
-		<text>转变后位置</text>
-	</view>
-	<view class="base transform" style="transform: scale(1.2,1.2)">
-		<text>scale(1.2,1.2)</text>
-		<text>转变后位置</text>
-	</view>
-</scroll-view>
+    <view class="base transform" style="transform: scaleX(0.6)">
+      <text>scaleX(0.6)</text>
+      <text>转变后位置</text>
+    </view>
+    <view class="base transform" style="transform: scaleY(0.6)">
+      <text>scaleY(0.6)</text>
+      <text>转变后位置</text>
+    </view>
+    <view class="base transform" style="transform: scale(1.2,1.2)">
+      <text>scale(1.2,1.2)</text>
+      <text>转变后位置</text>
+    </view>
+
+    <view class="base">
+      <text>通过scaleY(0.5)实现0.5px的线</text>
+      <view style="width: 150px; height: 1px; background-color: #000; transform: scaleY(0.5)"></view>
+      <!-- <view style="width: 750px; height: 1px; background-color: #ff0000; "></view> -->
+    </view>
+
+  </scroll-view>
 </template>
 
 <script lang="uts">
-export default {
-	data() {
-		return {
-		}
-	},
-	methods: {
-	},
-}
+  export default {
+    data() {
+      return {
+      }
+    },
+    methods: {
+    },
+  }
 </script>
 
 <style>
-.page {
-	flex: 1;
-	align-items: center;
-}
-.trace {
-	position: absolute;
-	top: 0px;
-	left: 0px;
-	width: 100%;
-	align-items: center;
-}
-.base {
-	margin: 10px;
-	width: 150px;
-	height: 150px;
-	align-items: center;
-	justify-content: center;
-}
-.reserve {
-	border: 1px dotted #588;
-	background-color: #DDD;
-}
-.reserve-text {
-	color: #CCC;
-}
-.transform {
-	border: 1px solid #00F;
-	background-color: rgba(0,255,255,0.5);
-}
+  .page {
+    flex: 1;
+    align-items: center;
+  }
+
+  .trace {
+    position: absolute;
+    top: 0px;
+    left: 0px;
+    width: 100%;
+    align-items: center;
+  }
+
+  .base {
+    margin: 10px;
+    width: 150px;
+    height: 150px;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .reserve {
+    border: 1px dotted #588;
+    background-color: #DDD;
+  }
+
+  .reserve-text {
+    color: #CCC;
+  }
+
+  .transform {
+    border: 1px solid #00F;
+    background-color: rgba(0, 255, 255, 0.5);
+  }
 </style>
-- 
GitLab