From 9c8d5c1ec30b5cde4e40234731b96f8bdad11138 Mon Sep 17 00:00:00 2001 From: lichaojun Date: Sat, 27 Dec 2025 23:09:16 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=8B=96=E6=8B=BD=E5=B8=83=E5=B1=80-?= =?UTF-8?q?=E5=BD=93=E5=89=8D=E9=80=89=E4=B8=AD=E7=84=A6=E7=82=B9=E8=AE=BE?= =?UTF-8?q?=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- demoHtml/flex/css/index.css | 7 ++++++- demoHtml/flex/image/img.png | Bin 0 -> 5076 bytes demoHtml/flex/image/movie.png | Bin 0 -> 6014 bytes demoHtml/flex/index.html | 8 +++++++- demoHtml/flex/js/index.js | 20 +++++++++++++------- 5 files changed, 26 insertions(+), 9 deletions(-) create mode 100644 demoHtml/flex/image/img.png create mode 100644 demoHtml/flex/image/movie.png diff --git a/demoHtml/flex/css/index.css b/demoHtml/flex/css/index.css index 4430db5..95cb636 100644 --- a/demoHtml/flex/css/index.css +++ b/demoHtml/flex/css/index.css @@ -72,7 +72,7 @@ html { .component-item { width: calc(50% - 5px); - height: 80px; + height: 120px; border-radius: 8px; cursor: pointer; display: flex; @@ -109,6 +109,11 @@ html { .grid-stack-item span { font-size: 14px; } +.image-container { + width: 100%; + height: 100%; + object-fit: cover; +} .action-btn { position: relative; width: 100%; diff --git a/demoHtml/flex/image/img.png b/demoHtml/flex/image/img.png new file mode 100644 index 0000000000000000000000000000000000000000..d8025c1986c81fcf7b9a1f733118a09db8cd2414 GIT binary patch literal 5076 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 literal 0 HcmV?d00001 diff --git a/demoHtml/flex/image/movie.png b/demoHtml/flex/image/movie.png new file mode 100644 index 0000000000000000000000000000000000000000..bb9d2c8ad148b63ddabac2edf268e80e89dbd7e8 GIT binary patch literal 6014 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 xzw_~bC+z
-
图片
+
+ +
文字
@@ -97,6 +102,7 @@