测试:修订间差异
来自SOKA CAFE
小 |
小 |
||
| 第1行: | 第1行: | ||
<!DOCTYPE html> | |||
<html lang="zh-CN"> | <html lang="zh-CN"> | ||
<head> | <head> | ||
<meta charset="UTF-8"> | <meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>B站视频卡片</title> | <title>B站视频卡片 · 修改版</title> | ||
<style> | <style> | ||
* { | * { | ||
| 第26行: | 第26行: | ||
} | } | ||
/* 平板及手机端调整 */ | |||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
body { | body { | ||
padding: | padding: 0; /* 手机端去掉body内边距,让容器真正最大宽度 */ | ||
} | } | ||
.video-card-container { | .video-card-container { | ||
max-width: 100%; | max-width: 100%; | ||
padding: 0 | padding: 0; /* 容器不留白 */ | ||
margin: 0; | margin: 0; | ||
} | } | ||
} | } | ||
/* 卡片容器圆角统一为4px */ | |||
.video-card { | .video-card { | ||
background: white; | background: white; | ||
border-radius: | border-radius: 4px; /* 原16px → 4px */ | ||
overflow: hidden; | overflow: hidden; | ||
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08); | box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08); | ||
| 第50行: | 第52行: | ||
padding-top: 56.25%; | padding-top: 56.25%; | ||
background: #000; | background: #000; | ||
border-radius: | border-radius: 4px 4px 0 0; /* 顶部圆角4px,底部为0,与卡片保持一致 */ | ||
overflow: hidden; | overflow: hidden; | ||
} | } | ||
| 第143行: | 第145行: | ||
} | } | ||
/* 标签组 */ | |||
.tags { | .tags { | ||
display: flex; | display: flex; | ||
| 第149行: | 第152行: | ||
} | } | ||
/* 强制灰底黑字,任何状态不变 */ | |||
.tag { | .tag { | ||
background: #f0f2f5; | background: #f0f2f5 !important; /* 固定灰色背景 */ | ||
color: # | color: #000000 !important; /* 纯黑色文字 */ | ||
border-radius: 14px; | border-radius: 14px; | ||
padding: 3px 10px; | padding: 3px 10px; | ||
| 第157行: | 第161行: | ||
white-space: nowrap; | white-space: nowrap; | ||
text-decoration: none; | text-decoration: none; | ||
display: inline-block; | |||
transition: none; /* 去除任何过渡影响 */ | |||
} | } | ||
.tag:hover { | .tag:hover, | ||
background: # | .tag:active, | ||
.tag:focus, | |||
.tag:visited { | |||
background: #f0f2f5 !important; /* 悬停等状态背景不变 */ | |||
color: #000000 !important; /* 文字颜色不变 */ | |||
text-decoration: none; | |||
} | } | ||
| 第207行: | 第218行: | ||
<a href="/wiki/エア本" class="tag">エア本</a> | <a href="/wiki/エア本" class="tag">エア本</a> | ||
</div> | </div> | ||
<!-- 原底部无内容,保留结构预留 --> | |||
</div> | </div> | ||
</div> | </div> | ||
2026年3月20日 (五) 08:04的版本
<!DOCTYPE html>
【创价】久本五月病 【久本信仰祭16】
