fix: NEW修复预览与保存不一致，添加3:4比例，输入框透明无边框

index.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
     <title>极简邀请函制作</title>
-    <link rel="stylesheet" href="style.css">
+    <link rel="stylesheet" href="css/style.css">
 </head>
 <body>
     <div class="app">
@@ -17,24 +17,12 @@
         <!-- 图片展示区 -->
         <div class="canvas-area" id="canvasArea">
             <div class="empty-tip" id="emptyTip">请点击上方「添加图片」按钮上传背景图</div>
-            <div class="image-container" id="imageContainer">
+            <div class="image-container empty" id="imageContainer">
                 <img id="bgImage" src="" alt="背景图">
                 <!-- 文字输入框1 -->
-                <div class="text-input" id="input1" contenteditable="false">姓名：</div>
+                <div class="text-input" id="input1" contenteditable="false" style="left: 60%; top: 75%;">姓名</div>
                 <!-- 文字输入框2 -->
-                <div class="text-input" id="input2" contenteditable="false">编号：</div>
-            </div>
-        </div>
-
-        <!-- 手机端输入控制区 -->
-        <div class="mobile-input-controls" id="mobileInputControls">
-            <div class="input-control-group">
-                <label>姓名：</label>
-                <input type="text" id="mobileInput1" placeholder="请输入姓名" value="姓名">
-            </div>
-            <div class="input-control-group">
-                <label>编号：</label>
-                <input type="text" id="mobileInput2" placeholder="请输入编号" value="编号">
+                <div class="text-input" id="input2" contenteditable="false" style="left: 60%; top: 85%;">编号</div>
             </div>
         </div>
 
@@ -45,6 +33,6 @@
     <input type="file" id="fileInput" accept="image/*" hidden>
     <canvas id="exportCanvas" hidden></canvas>
 
-    <script src="script.js"></script>
+    <script src="js/script.js"></script>
 </body>
 </html>