From 4bf9f2705671fcf182a3d4ee59ccfe366c3631b4 Mon Sep 17 00:00:00 2001 From: maogeigei Date: Thu, 3 Sep 2026 19:48:28 +0800 Subject: [PATCH] =?UTF-8?q?R48=20=E8=A1=A5=EF=BC=9A=E8=A7=86=E9=A2=91?= =?UTF-8?q?=E8=AF=A6=E6=83=85=E5=B1=9E=E6=80=A7=E7=BB=9F=E4=B8=80=E5=AE=BD?= =?UTF-8?q?=E5=BA=A6=20140px=E2=80=94=E2=80=948=20=E5=AD=97=E6=AE=B5?= =?UTF-8?q?=E4=B8=A5=E6=A0=BC=E7=AD=89=E5=AE=BD=20+=20=E5=8E=BB=E6=A8=AA?= =?UTF-8?q?=E5=90=91=E9=97=B4=E9=9A=94(gap=2080px=E2=86=920)=EF=BC=8C?= =?UTF-8?q?=E6=A0=87=E7=AD=BE(info-wide)=E5=8D=A0=E6=95=B4=E8=A1=8C?= =?UTF-8?q?=E4=B8=8D=E5=8F=97=E9=99=90=E5=AE=BD=EF=BC=9B=E7=A7=BB=E9=99=A4?= =?UTF-8?q?=20vid-limited=20=E5=86=97=E4=BD=99=20max-width=EF=BC=9Bstyle?= =?UTF-8?q?=20ai=E2=86=92aj?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../V1.0/mcn-work-shop/public/index.html | 2 +- .../V1.0/mcn-work-shop/public/style.css | 12 ++++++------ 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/project/短视频脚本创作/V1.0/mcn-work-shop/public/index.html b/project/短视频脚本创作/V1.0/mcn-work-shop/public/index.html index 1731b96..47995b3 100644 --- a/project/短视频脚本创作/V1.0/mcn-work-shop/public/index.html +++ b/project/短视频脚本创作/V1.0/mcn-work-shop/public/index.html @@ -4,7 +4,7 @@ MCN热点雷达 - + diff --git a/project/短视频脚本创作/V1.0/mcn-work-shop/public/style.css b/project/短视频脚本创作/V1.0/mcn-work-shop/public/style.css index 71ca840..6718cdf 100644 --- a/project/短视频脚本创作/V1.0/mcn-work-shop/public/style.css +++ b/project/短视频脚本创作/V1.0/mcn-work-shop/public/style.css @@ -540,12 +540,12 @@ td.td-title { max-width: 240px; } .info-value { font-size: 15px; color: var(--text); word-break: break-word; white-space: pre-wrap; line-height: 1.6; } /* 视频详情信息卡:标题独立一行(大字号),下方按行分组 */ /* 视频详情字段对齐(09-02 终版):8 字段同处一个 grid 容器(2 行 × 4 列),列轨道跨行共享——第 i 列严格对齐(分享↔时长、收藏↔发布时间);列宽贴合内容(min-content~max-content,非均分);横向间隔 80px 与账号信息一致。之前用两个独立 .info-row 容器导致跨行不对齐 */ -.video-info .video-grid { display: grid; grid-template-columns: repeat(4, minmax(min-content, max-content)); gap: 10px 80px; justify-content: start; } -.video-info .video-grid .info-item { min-width: 0; } -.video-info .video-grid .info-item.info-wide { grid-column: 1 / -1; } -/* 视频ID 限宽(09-02):长数字不把第一行撑爆,多余省略号 + hover 提示全量 */ -.video-info .info-item.vid-limited { max-width: 220px; } -.video-info .info-item.vid-limited .info-value { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.video-info .video-grid { display: grid; grid-template-columns: repeat(4, minmax(min-content, max-content)); gap: 10px 0; justify-content: start; } +.video-info .video-grid .info-item { width: 140px; } +.video-info .video-grid .info-item.info-wide { grid-column: 1 / -1; width: auto; } +/* 视频详情属性内容统一宽度(09-03 R48):与账号详情同款——8 字段固定 width 140px、横向间隔 0;超宽单行省略号 + hover 看全量; + 标签(info-wide)占整行不受限宽保持换行;原视频ID vid-limited 独立 max-width 220 已被统一 140 覆盖,移除冗余规则 */ +.video-info .video-grid .info-item:not(.info-wide) .info-value { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* 长文本默认最多 4 行,可点击展开/收起(账号定位等) */ /* 09-01 改用 block+max-height 裁剪:display:-webkit-box 下长句不折行,内容宽被撑到 1896px 导致 main 横向滚动条 */ .clamp-text { display: block; max-height: 96px; overflow: hidden; word-break: break-word; overflow-wrap: anywhere; } /* 96px=4行×15px×1.6 */