测试:修订间差异
来自SOKA CAFE
小 |
小 |
||
| 第17行: | 第17行: | ||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; | font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; | ||
display: flex; | display: flex; | ||
justify-content: center; | justify-content: center; /* 默认居中(PC/平板) */ | ||
} | } | ||
/* 响应式容器:默认60vw */ | |||
.video-card-container { | .video-card-container { | ||
width: 100%; | width: 100%; | ||
| 第26行: | 第27行: | ||
} | } | ||
/* 手机端:强制靠右 */ | |||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
body { | body { | ||
| 第31行: | 第33行: | ||
} | } | ||
.video-card-container { | .video-card-container { | ||
max-width: 100%; | max-width: 100% !important; | ||
padding: 0 8px; | padding: 0 8px; | ||
margin: 0; | margin: 0; /* 取消居中 margin */ | ||
} | } | ||
} | } | ||
/* 卡片主体 */ | |||
.video-card { | .video-card { | ||
background: white; | background: white; | ||
| 第45行: | 第48行: | ||
} | } | ||
/* B站视频容器(16:9比例) */ | |||
.bilibili-container { | .bilibili-container { | ||
position: relative; | position: relative; | ||
| 第63行: | 第67行: | ||
} | } | ||
/* 底部信息区 */ | |||
.info-section { | .info-section { | ||
padding: 18px; | padding: 18px; | ||
} | } | ||
| 第74行: | 第77行: | ||
align-items: center; | align-items: center; | ||
margin-bottom: 14px; | margin-bottom: 14px; | ||
} | } | ||
| 第82行: | 第83行: | ||
align-items: center; | align-items: center; | ||
gap: 10px; | gap: 10px; | ||
} | } | ||
| 第96行: | 第96行: | ||
font-weight: bold; | font-weight: bold; | ||
font-size: 14px; | font-size: 14px; | ||
} | } | ||
| 第103行: | 第102行: | ||
font-weight: 600; | font-weight: 600; | ||
color: #18191c; | color: #18191c; | ||
} | } | ||
/* 强制白色:使用 !important + 颜色锁定 */ | |||
.detail-link { | .detail-link { | ||
background: linear-gradient(120deg, #ff4d85, #ff6b6b); | background: linear-gradient(120deg, #ff4d85, #ff6b6b); | ||
color: #ffffff !important; | color: #ffffff !important; /* 强制白色 */ | ||
text-decoration: none; | text-decoration: none; | ||
border-radius: 20px; | border-radius: 20px; | ||
| 第117行: | 第116行: | ||
transition: all 0.2s; | transition: all 0.2s; | ||
box-shadow: 0 2px 6px rgba(255, 77, 133, 0.3); | box-shadow: 0 2px 6px rgba(255, 77, 133, 0.3); | ||
/* 防止被高亮或系统主题覆盖 */ | |||
-webkit-text-fill-color: #ffffff !important; | -webkit-text-fill-color: #ffffff !important; | ||
text-fill-color: #ffffff !important; | text-fill-color: #ffffff !important; | ||
} | } | ||
| 第134行: | 第132行: | ||
line-height: 1.5; | line-height: 1.5; | ||
margin-bottom: 10px; | margin-bottom: 10px; | ||
word-break: break-word; | |||
} | } | ||
| 第161行: | 第160行: | ||
.tag:hover { | .tag:hover { | ||
background: #e6e8eb; | background: #e6e8eb; | ||
} | } | ||
</style> | </style> | ||
| 第174行: | 第166行: | ||
<div class="video-card-container"> | <div class="video-card-container"> | ||
<div class="video-card"> | <div class="video-card"> | ||
<!-- B站视频嵌入 --> | |||
<div class="bilibili-container"> | <div class="bilibili-container"> | ||
<iframe | <iframe | ||
| 第188行: | 第181行: | ||
<span class="username">H娘</span> | <span class="username">H娘</span> | ||
</div> | </div> | ||
<!-- 详情页链接:文字强制白色 --> | |||
<a href="https://www.bilibili.com/video/BV1eXSMYVEcc" | <a href="https://www.bilibili.com/video/BV1eXSMYVEcc" | ||
target="_blank" | target="_blank" | ||
| 第202行: | 第196行: | ||
</div> | </div> | ||
<!-- 标签改为维基链接:[[标签]] → /wiki/标签 --> | |||
<div class="tags"> | <div class="tags"> | ||
<a href="/wiki/宗教都市祭" class="tag">宗教都市祭</a> | <a href="/wiki/宗教都市祭" class="tag">宗教都市祭</a> | ||
<a href="/wiki/久本投稿祭'25" class="tag">久本投稿祭'25</a> | <a href="/wiki/久本投稿祭'25" class="tag">久本投稿祭'25</a> | ||
<a href="/wiki/エア本" class="tag">エア本</a> | <a href="/wiki/エア本" class="tag">エア本</a> | ||
</div> | </div> | ||
</div> | </div> | ||
2026年3月19日 (四) 19:03的版本
<!DOCTYPE html>
【创价】久本五月病 【久本信仰祭16】
