From b4869ac00500438f43dc58675f8f98121589dddb Mon Sep 17 00:00:00 2001
From: zhcnyuyang <yyydm@qq.com>
Date: Thu, 21 Aug 2025 16:39:00 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A7=A3=E5=86=B3=E5=B8=83=E5=B1=80=E8=B7=B3?=
 =?UTF-8?q?=E5=8A=A8=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/publicstyle.scss | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/src/publicstyle.scss b/src/publicstyle.scss
index 062498f..f39d2b2 100644
--- a/src/publicstyle.scss
+++ b/src/publicstyle.scss
@@ -41,7 +41,7 @@
   z-index: 0;
   overflow: hidden;
 
-  // 默认状态：视频未加载时使用固定aspect-ratio
+  // 始终保持固定的aspect-ratio作为占位，确保立即渲染
   @include media-breakpoint-between(xs, md) {
     aspect-ratio: 1.92;
   }
@@ -49,23 +49,27 @@
     aspect-ratio: 2.62026969;
   }
 
-  // 视频元素默认样式
-  video {
+  // 视频/图片元素的默认样式
+  video, .videoimg {
+    position: absolute;
+    top: 0;
+    left: 0;
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;
   }
 
-  // 当视频加载完成后，切换为自适应高度模式
+  // 当媒体加载完成后，重新调整容器和媒体尺寸
   &.video-loaded {
     aspect-ratio: unset; // 移除固定比例
     height: auto; // 高度自适应
 
-    video {
+    video, .videoimg {
+      position: static; // 改为文档流布局
       width: 100%; // 宽度占满
       height: auto; // 高度自适应
-      object-fit: contain; // 保持视频比例，完整显示
+      object-fit: contain; // 保持媒体比例，完整显示
     }
   }
 }