首页
最近更改
MediaWiki帮助
中文社区
模组
人物
团体
群聊
历史
外网社区
模组
发帖交流
论坛
聊天
博客
快捷访问
分类
文件列表
上传文件
用户列表
用户通知
礼物列表
随机页面
聊天中的在线用户
系统消息
讨论
查看源代码
查看历史
刷新
创建账号
登录
查看“︁MediaWiki:Common.css”︁的源代码
来自Age Of History 2 Chinese Wiki
←
Common.css
跳转至:
导航
、
搜索
因为以下原因,您没有权限编辑该页面:
您请求的操作仅限属于该用户组的用户执行:
用户
此页面为本wiki上的软件提供界面文本,并受到保护以防止滥用。 如欲修改所有wiki的翻译,请访问
translatewiki.net
上的MediaWiki本地化项目。
您无权编辑此CSS页面,因为编辑此页面可能会影响所有访问者。
您可以查看和复制此页面的源代码。
/* 这里放置的CSS将应用于所有皮肤 */ @import url("https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap"); @import url("https://fastly.jsdelivr.net/gh/hoah2333/Fonts@main/Typeface-VonwaonBitmap-16px.css"); @import url("https://fastly.jsdelivr.net/gh/hoah2333/Fonts@main/Typeface-VonwaonBitmap-12px.css"); /* 引入12px字体 */ :root { --link-color: #0645ad; --link-color-active: #faa700; --custom-background-blue: #ccf; --custom-background-cyan: #cef; --custom-background-green: #cfc; --custom-background-gray: #d2d2d2; --custom-background-grey: var(--custom-background-gray); --custom-background-magenta: #fdf; --custom-background-orange: #fdb; --custom-background-purple: #ecf; --custom-background-red: #fcc; --custom-background-yellow: #ffc; --custom-border-blue: #36e; --custom-border-cyan: #9df; --custom-border-green: #5d5; --custom-border-gray: #bbb; --custom-border-grey: var(--custom-border-gray); --custom-border-magenta: #f9f; --custom-border-orange: #f90; --custom-border-purple: #96c; --custom-border-red: #e44; --custom-border-yellow: #fc3; --custom-closed-topic-neutral: #eef; --custom-closed-topic-no: #fee; --custom-closed-topic-yes: #efe; --custom-code-background: #f8f9fa; --custom-load-page-button-color: #fff8; --custom-main-page-background: #fcfcfc; --custom-main-page-border: var(--custom-border-gray); --custom-main-page-edition-subheader: #333; --custom-mcwiki-header-color: #bcd4f5; --custom-navbox-background: #fff; --custom-navbox-top: #ccc; --custom-navbox-middle: #ddd; --custom-navbox-thru: #eee; --custom-nbt-inherit-color: #e6e6fa; --custom-table-background: #f8f9fa; --custom-table-alternate-background: #f0f1f2; --custom-table-choice-always: #003600; --custom-table-choice-always-background: #80d080; --custom-table-choice-default: #fff; --custom-table-choice-in-off-background: #060; --custom-table-choice-in-on-background: #0c0; --custom-table-choice-na: #000; --custom-table-choice-na-background: #fff; --custom-table-choice-neutral: #634800; --custom-table-choice-neutral-background: #ffeb9c; --custom-table-choice-never: #3c0404; --custom-table-choice-never-background: #ff8080; --custom-table-choice-no: #840606; --custom-table-choice-no-background: #ffc7ce; --custom-table-choice-out-off-background: #900; --custom-table-choice-out-on-background: #f00; --custom-table-choice-partial: #665400; --custom-table-choice-partial-background: #ffd; --custom-table-choice-planned: #0131b7; --custom-table-choice-planned-background: #dfdfff; --custom-table-choice-rarely: #533400; --custom-table-choice-rarely-background: #fdce5e; --custom-table-choice-unknown: #222; --custom-table-choice-unknown-background: #ccc; --custom-table-choice-yes: #005600; --custom-table-choice-yes-background: #c6efce; --custom-table-header-background: #e8ebee; --custom-topic-30-days: #bbb; --custom-topic-7-days: #ddd; /* CRT效果相关变量 - 进一步调整 */ --crt-scanline-main-alpha: 0.12; --crt-scanline-secondary-alpha: 0.06; --crt-scanline-fast-alpha: 0.04; --crt-flicker-alpha: 0.025; --crt-noise-alpha: 0.03; --crt-glow-radius: 0.1em; --crt-glow-color: rgba(90, 255, 150, 0.2); /* 调整辉光 */ --crt-text-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color); --crt-static-noise-opacity: 0.05; /* 网格背景相关变量 */ --grid-color: rgba(0, 0, 0, 0.07); --grid-size: 35px; --grid-line-width: 1px; /* 字体设置 - 使用VonwaonBitmap 16px/12px */ --font-body: 'VonwaonBitmap 16px', monospace; --font-title: 'VonwaonBitmap 12px', 'Press Start 2P', monospace; /* 12px优先,Press Start备用 */ --font-ui: 'VonwaonBitmap 12px', monospace; /* 基础大小 - Vonwaon是像素字体,直接用16px/12px */ --base-font-size-px: 16; --ui-font-size-px: 12; --code-font-size-px: 14; /* 代码可以用16px或稍小 */ /* 边框和质感 */ --main-border-color: rgba(0, 0, 0, 0.2); --inner-highlight-color: rgba(255, 255, 255, 0.3); --inner-shadow-color: rgba(0, 0, 0, 0.1); /* 启用/禁用扫描线效果 */ --scanlines-display: block; /* 保持block */ } /* 基础CRT效果动画 */ @keyframes flicker { 0%, 100% { opacity: 0.99; filter: brightness(1.0); } 25% { opacity: 0.97; filter: brightness(0.98); } 50% { opacity: 0.98; filter: brightness(1.01); } 75% { opacity: 0.96; filter: brightness(0.97); } } @keyframes scanline-main { 0% { background-position: 0 0; } 100% { background-position: 0 6px; } } @keyframes scanline-secondary { 0% { background-position: 0 1px; } /* 起始偏移 */ 100% { background-position: 0 7px; } } @keyframes scanline-fast { 0% { background-position: 0 0; } 100% { background-position: 0 20px; } } @keyframes subtle-noise { 0%, 100% { opacity: var(--crt-static-noise-opacity); } 50% { opacity: calc(var(--crt-static-noise-opacity) * 0.7); } } @keyframes crt-on { 0% { opacity: 0; filter: brightness(5) saturate(0) contrast(3); } 25% { opacity: 0.6; filter: brightness(1.5) saturate(0.5) contrast(1.2); } 100% { opacity: 1; filter: brightness(1) saturate(1) contrast(1); } } /* 全局和背景样式 - 增加质感 */ html { min-height: 100%; background-color: #2a2a2e; /* 深色背景,模拟CRT关闭时的屏幕 */ background-image: /* 网格线 */ linear-gradient(var(--grid-color) var(--grid-line-width), transparent var(--grid-line-width)), linear-gradient(90deg, var(--grid-color) var(--grid-line-width), transparent var(--grid-line-width)), /* 静态噪点 */ url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='5' viewBox='0 0 5 5'%3E%3Cpath fill='%23ffffff' fill-opacity='0.06' d='M0 0h1v1H0V0zm1 1h1v1H1V1zm1 1h1v1H2V2zm1 1h1v1H3V3zm1 1h1v1H4V4z'/%3E%3C/svg%3E"); background-size: var(--grid-size) var(--grid-size), var(--grid-size) var(--grid-size), auto; background-position: center center; font-smooth: never; /* 尝试禁用字体平滑 */ -webkit-font-smoothing: none; } body { font-family: var(--font-body); font-size: calc(var(--base-font-size-px) * 1px); line-height: 1.7; color: #ddd; /* CRT亮色文本 */ position: relative; min-height: calc(100vh - 2rem); margin: 1rem; padding: 1.8rem; background-color: rgba(30, 45, 35, 0.96); /* 深绿色调CRT背景 */ border: 1px solid var(--main-border-color); border-radius: 6px; /* 轻微增加圆角 */ box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3), inset 0 1px 0 var(--inner-highlight-color), /* 模拟顶部高光 */ inset 0 -1px 0 var(--inner-shadow-color), /* 模拟底部阴影 */ inset 0 0 50px rgba(90, 255, 150, 0.08); /* 更深的内部辉光 */ animation: crt-on 1.2s cubic-bezier(0.25, 1, 0.5, 1), /* 调整启动动画 */ flicker 80s infinite alternate ease-in-out; overflow: hidden; /* 必须,确保伪元素在内部 */ } /* 复合扫描线效果 */ body::before, body::after { content: ""; display: var(--scanlines-display); position: absolute; /* 改为absolute相对body */ top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; /* 降低z-index让内容可见 */ } /* ::before 用于主扫描线和快速扫描线 */ body::before { background: /* 快速扫描线 */ repeating-linear-gradient( to bottom, transparent 0px, transparent 1px, rgba(200, 255, 220, var(--crt-scanline-fast-alpha)) 1px, rgba(200, 255, 220, var(--crt-scanline-fast-alpha)) 2px ), /* 主扫描线 */ repeating-linear-gradient( to bottom, rgba(0, 0, 0, 0) 0px, rgba(0, 0, 0, 0) 3px, /* 透明区域 */ rgba(0, 0, 0, var(--crt-scanline-main-alpha)) 4px, /* 主线 */ rgba(0, 0, 0, var(--crt-scanline-main-alpha)) 6px /* 主线宽度 */ ); background-size: 100% 20px, 100% 6px; mix-blend-mode: overlay; /* 主线用overlay */ animation: scanline-fast 0.8s linear infinite, scanline-main 8s linear infinite; opacity: 0.7; } /* ::after 用于次扫描线和动态噪点 */ body::after { background: /* 动态噪点 */ url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.08'%3E%3Cpath d='M14 18h1v1h-1zM21 20h1v1h-1zM24 11h1v1h-1zM40 15h1v1h-1zM15 4h1v1h-1zM6 13h1v1H6zM49 42h1v1h-1zM42 55h1v1h-1zM31 54h1v1h-1zM17 48h1v1h-1z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"), /* 次扫描线 */ repeating-linear-gradient( to bottom, transparent 0px, transparent 4px, rgba(50, 150, 100, var(--crt-scanline-secondary-alpha)) 5px, /* 次线 */ rgba(50, 150, 100, var(--crt-scanline-secondary-alpha)) 6px /* 次线宽度 */ ); background-size: 60px 60px, 100% 7px; /* 噪点大小,次线重复 */ mix-blend-mode: screen; /* 次线和噪点尝试screen */ animation: subtle-noise 4s infinite alternate, /* 噪点动画 */ scanline-secondary 12s linear infinite; /* 次线动画 */ opacity: 0.8; } /* CRT启动动画 (移除,如果之前添加了.crt-startup div) */ .crt-startup { display: none; } /* 标题样式 - 使用12px字体,增加细节 */ h1, h2, h3, h4, h5, h6 { font-family: var(--font-title); font-size: calc(var(--ui-font-size-px) * 1px); /* 直接使用12px */ font-weight: normal; text-shadow: var(--crt-text-shadow), 0 0 5px rgba(255,255,255,0.1); /* 增加一点白色辉光 */ letter-spacing: 0.05em; text-transform: uppercase; /* 标题大写 */ position: relative; margin-top: 2.2em; margin-bottom: 1.2em; padding-bottom: 0.5em; padding-left: 0.5em; border-bottom: 1px solid rgba(90, 255, 150, 0.2); /* 辉光色边框 */ border-left: 3px solid rgba(90, 255, 150, 0.3); color: #e8f8ef; /* 标题亮色 */ } /* 移除之前添加的标题:after伪元素 */ h1::after, h2::after, h3::after { content: none; } /* 标题大小现在由font-size控制,不再需要额外调整 */ /* 链接样式 - 更复古 */ a { color: #7bf0a0; /* 亮绿色链接 */ text-decoration: none; /* 移除下划线 */ position: relative; transition: color 0.2s ease, background-color 0.2s ease, text-shadow 0.2s ease; padding: 0px 2px; /* 微调padding */ border-radius: 1px; text-shadow: var(--crt-text-shadow); background-color: transparent; /* 默认无背景 */ } a:hover { color: #fff; /* 悬停变白 */ background-color: rgba(123, 240, 160, 0.2); /* 悬停背景 */ text-shadow: 0 0 5px #fff, 0 0 10px var(--crt-glow-color); /* 更强辉光 */ } a.new { color: #ff8080; /* 红色新链接 */ text-shadow: 0 0 3px rgba(255, 128, 128, 0.4); } a.new:hover { color: #fff; background-color: rgba(255, 128, 128, 0.2); text-shadow: 0 0 5px #fff, 0 0 10px rgba(255, 128, 128, 0.5); } /* Infobox样式 - 增强质感 */ .notaninfobox { position: relative; clear: right; margin: 0 0 1em 1em; width: 350px; font-size: calc(var(--ui-font-size-px) * 1px); /* UI字体大小 */ background: linear-gradient(to bottom, rgba(40, 60, 45, 0.95), rgba(30, 50, 35, 0.95)); /* 深色渐变背景 */ float: right; border: 1px solid rgba(90, 255, 150, 0.3); /* 辉光色边框 */ padding: 2px; overflow: auto; z-index: 1; overflow-wrap: anywhere; box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(90, 255, 150, 0.15), /* 内部高光 */ inset 0 0 15px rgba(90, 255, 150, 0.06); /* 内部辉光 */ animation: flicker 60s infinite alternate; border-radius: 4px; color: #c0e0d0; /* Infobox内文本颜色 */ } @media all and (max-width: 511px) { .notaninfobox { float: none; margin-left: 0; width: auto; } } @media all and (max-width: 337px) { .notaninfobox { margin-left: -16px; margin-right: -16px; border-left: none; border-right: none; } } .notaninfobox > .infobox-title { font-family: var(--font-title); font-size: calc(var(--ui-font-size-px) * 1px); /* 标题字体 */ font-weight: normal; text-align: center; background: linear-gradient(to bottom, rgba(90, 255, 150, 0.18), rgba(90, 255, 150, 0.08)); color: #e8f8ef; /* 亮色标题 */ text-shadow: var(--crt-text-shadow); padding: 7px 5px; border-bottom: 1px solid rgba(90, 255, 150, 0.25); text-transform: uppercase; } .infobox-imagearea { text-align: center; padding: 4px; } .infobox-imagearea > div:not(:first-child) { padding-top: 1em; } /* Horizontally centre animated images */ .infobox-imagearea .animated { display: inline-flex; align-items: center; } .notaninfobox .infobox-rows { display: grid; grid-template-columns: max-content 1fr; gap: 1px; } .notaninfobox .infobox-rows .infobox-row { display: contents; } .notaninfobox .infobox-row .infobox-row-label, .notaninfobox .infobox-row .infobox-row-field { padding: 4px; } .notaninfobox .infobox-row .infobox-row-label { font-family: var(--font-ui); font-weight: normal; /* UI字体本身可能较粗 */ color: #90c0a0; /* 标签颜色 */ text-shadow: none; padding-right: 0.8em; } .notaninfobox .infobox-rows .infobox-row:nth-child(2n) .infobox-row-label, .notaninfobox .infobox-rows .infobox-row:nth-child(2n) .infobox-row-field { background-color: rgba(90, 255, 150, 0.04); /* 非常淡的隔行背景 */ } .notaninfobox .infobox-row .infobox-row-field { color: #d0f0e0; /* 字段值颜色 */ } /* Infoboxes with tabber */ .tabber-container-infobox .tabber .tabbertab, .tabber-container-infobox ul.tabbernav li a, .tabber-container-infobox ul.tabbernav li.tabberactive a { background: none; border: none; } .tabber-container-infobox .tabber .tabbertab { padding: 0; } .tabber-container-infobox ul.tabbernav { font: inherit; font-size: 100%; } .tabber-container-infobox ul.tabbernav li a:hover { color: #000; } .tabber-container-infobox ul.tabbernav > li { margin-bottom: 5px; padding: 0; } .tabber-container-infobox ul.tabbernav > li > a { color: #595959; padding-bottom: 1px; display: block; font-family: var(--font-body); } .tabber-container-infobox ul.tabbernav > li > a::before { display: block; content: attr(alt); font-weight: bold; height: 0; color: transparent; overflow: hidden; visibility: hidden; } .tabber-container-infobox ul.tabbernav > li.tabberactive { border: none; } .modulebox { border: 1px solid #ccc; padding: 10px; margin: 10px 0; background-color: #f9f9f9; box-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color); } .tabber-container-infobox ul.tabbernav > li.tabberactive > a { font-weight: bold; color: var(--link-color); border-bottom: 2px solid var(--custom-mcwiki-header-color); } .infobox-rows p { margin: 0; } .infobox-rows dl + dl { margin-top: -0.4em; } .infobox-rows dl:last-child { margin-bottom: 0.2em; } .infobox-footer { text-align: center; font-family: var(--font-body); text-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color); } /* 页面底部导航框 - 调整 */ table.navbox{ border: 1px solid rgba(90, 255, 150, 0.25); background-color: rgba(35, 55, 40, 0.94); box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2); } .navbox-title, table.navbox th{ font-family: var(--font-title); background: linear-gradient(to bottom, rgba(90, 255, 150, 0.18), rgba(90, 255, 150, 0.08)); color: #d8f8e8; text-shadow: var(--crt-text-shadow); } .navbox-abovebelow, .navbox-group, .navbox-subgroup .navbox-title{ font-family: var(--font-ui); background: linear-gradient(to bottom, rgba(90, 255, 150, 0.12), rgba(90, 255, 150, 0.06)); color: #b0e0c0; text-shadow: var(--crt-text-shadow); } .navbox-subgroup .navbox-group, .navbox-subgroup .navbox-abovebelow{ background: linear-gradient(to bottom, rgba(90, 255, 150, 0.08), rgba(90, 255, 150, 0.04)); } .navbox-list { font-family: var(--font-body); font-size: calc(var(--base-font-size-px) * 1px); } .navbox-even{ background-color: rgba(90, 255, 150, 0.03); } .navbox-odd{ background-color: transparent; } /* 按钮样式 - 增强复古感 */ .collapseButton { font-family: var(--font-ui); font-size: calc(var(--ui-font-size-px) * 1px); padding: 4px 10px; border: 1px solid rgba(90, 255, 150, 0.4); /* 辉光边框 */ border-radius: 3px; background: linear-gradient(to bottom, rgba(60, 80, 65, 0.9), rgba(40, 60, 45, 0.9)); /* 深色按钮背景 */ color: #b0e0c0; /* 按钮文字颜色 */ text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3); /* 文字底部阴影 */ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(90, 255, 150, 0.15); /* 外阴影和内高光 */ cursor: pointer; transition: all 0.15s ease; float: right; font-weight: normal; text-align: right; width: auto; margin: 3px 5px; } .collapseButton:hover { background: linear-gradient(to bottom, rgba(70, 90, 75, 0.9), rgba(50, 70, 55, 0.9)); border-color: rgba(120, 255, 180, 0.6); color: #d8f8e8; /* 悬停文字变亮 */ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(120, 255, 180, 0.2); } .collapseButton:active { background: linear-gradient(to bottom, rgba(40, 60, 45, 0.9), rgba(60, 80, 65, 0.9)); /* 按下反转渐变 */ box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3); /* 按下内阴影 */ text-shadow: none; color: #a0d0b0; } .navbox .collapseButton { width: 6em; } /* 黑幕效果 */ .heimu, .heimu rt{ --heimu-color: #252525; --heimu-text-color: #fff; --heimu-link-color: #add8e6; --heimu-visited-link-color: #c5cae9; --heimu-new-link-color: #fcc; --heimu-new-visited-link-color: #ef9a9a; --heimu-extiw-visited-link-color: #d1c4e9; background-color: var(--heimu-color); } .heimu, .heimu a, a .heimu, a.new .heimu, span.heimu a:visited, span.heimu a.new, span.heimu a.external, span.heimu a.external:visited, span.heimu a.extiw, span.heimu a.extiw:visited, span.heimu a.mw-disambig, span.heimu a.mw-redirect{ transition: color 0.13s linear; color: var(--heimu-color); text-shadow: none; } span.heimu:hover, span.heimu:active{ color: var(--heimu-text-color); } span.heimu:hover a, a:hover span.heimu{ color: var(--heimu-link-color); } span.heimu:hover a:visited, a:visited:hover span.heimu{ color: var(--heimu-visited-link-color); } span.heimu:hover a.new, a.new:hover span.heimu{ color: var(--heimu-new-link-color); } span.heimu a.new:hover:visited, a.new:hover:visited span.heimu{ color: var(--heimu-new-visited-link-color); } span.heimu:hover a.extiw:visited, a.extiw:visited:hover span.heimu{ color: var(--heimu-extiw-visited-link-color); } [color-mode="dark"] .heimu, [color-mode="dark"] .heimu rt{ --heimu-color: #5e6272; } /* 彩幕效果 */ .colormu-drk { color: #FFF; } .colormu-bri { color: #000; } .colormu-drk:not(.colormu_toggle_on) a { color: #add8e6; } .colormu-drk:not(.colormu_toggle_on) a.new { color: #FCC; } .colormu>span, .colormu a, .colormu a>span { transition: color 0.2s; } .colormu:not(:hover):not(:active):not(.colormu_toggle_on)>span, .colormu:not(:hover):not(:active):not(.colormu_toggle_on) a { color: transparent; } .colormu:not(:hover):not(:active):not(.colormu_toggle_on) a>span { color: transparent !important; } a .colormu-bri { color: inherit; } a:hover .colormu>span, a:active .colormu>span, .colormu-drk.colormu_toggle_on, .colormu_toggle_on>span, .colormu-drk.colormu_toggle_on a>span { color: inherit !important; } /* 表格样式 - 调整 */ table { border: 1px solid rgba(90, 255, 150, 0.3); background-color: rgba(40, 60, 45, 0.92); box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2); border-radius: 4px; margin: 1.5em 0; } table th { font-family: var(--font-ui); font-size: calc(var(--ui-font-size-px) * 1px); background: linear-gradient(to bottom, rgba(90, 255, 150, 0.15), rgba(90, 255, 150, 0.08)); color: #d0f0e0; font-weight: normal; text-shadow: var(--crt-text-shadow); padding: 10px 14px; text-transform: uppercase; border-bottom: 1px solid rgba(90, 255, 150, 0.25); } table td, table th { border: 1px solid rgba(90, 255, 150, 0.15); padding: 9px 13px; transition: background-color 0.2s ease; font-family: var(--font-body); font-size: calc(var(--base-font-size-px) * 1px); } table tr:nth-child(even) td { background-color: rgba(90, 255, 150, 0.04); } table tr:hover td { background-color: rgba(90, 255, 150, 0.1); color: #fff; } /* 代码样式 - 调整 */ pre, code { font-family: var(--font-body); /* 或指定等宽字体 */ font-size: calc(var(--code-font-size-px) * 1px); background-color: rgba(10, 20, 15, 0.85); /* 更深的背景 */ border: 1px solid rgba(90, 255, 150, 0.2); padding: 0.4em 0.6em; text-shadow: none; border-radius: 3px; color: #a8d8b8; /* 代码文本颜色 */ } pre { padding: 1.2em; overflow-x: auto; background: repeating-linear-gradient( -45deg, rgba(10, 20, 15, 0.85), rgba(10, 20, 15, 0.85) 5px, rgba(15, 25, 20, 0.85) 5px, rgba(15, 25, 20, 0.85) 10px ), /* 斜纹背景 */ rgba(10, 20, 15, 0.9); box-shadow: inset 0 2px 5px rgba(0,0,0,0.3); } /* 确保文本内容在荧光字体下清晰可读 */ p, li, td, th, figcaption, blockquote, cite { /* 字体和大小已分别设置 */ line-height: 1.7; letter-spacing: 0.02em; /* 像素字体可能需要调整间距 */ position: relative; text-shadow: var(--crt-text-shadow); } /* 图片效果 - 增加边框效果 */ img { max-width: 100%; height: auto; transition: all 0.25s ease; border-radius: 2px; border: 1px solid rgba(90, 255, 150, 0.2); box-shadow: 0 1px 2px rgba(0,0,0,0.15), inset 0 0 3px rgba(0,0,0,0.2); } img:hover { box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2), 0 0 10px var(--crt-glow-color), /* 调整悬停辉光 */ inset 0 0 5px rgba(90, 255, 150, 0.1); transform: scale(1.01); border-color: rgba(120, 255, 180, 0.4); } /* 滚动条样式 - 适配暗色主题 */ ::-webkit-scrollbar { width: 13px; height: 13px; } ::-webkit-scrollbar-track { background: rgba(0, 0, 0, 0.2); border-radius: 6px; box-shadow: inset 0 0 4px rgba(0,0,0,0.4); } ::-webkit-scrollbar-thumb { background: linear-gradient(to bottom, rgba(90, 255, 150, 0.4), rgba(90, 255, 150, 0.2)); border-radius: 6px; border: 1px solid rgba(0, 0, 0, 0.4); box-shadow: inset 0 1px 0 rgba(90, 255, 150, 0.2); } ::-webkit-scrollbar-thumb:hover { background: linear-gradient(to bottom, rgba(110, 255, 170, 0.5), rgba(110, 255, 170, 0.3)); } /* 打印样式覆盖 - 保持不变 */ @media print { :root { --scanlines-display: none; } body::before, body::after, body .scanlines { display: none !important; } * { text-shadow: none !important; box-shadow: none !important; animation: none !important; } body, p, li, td, th { font-family: serif !important; } h1, h2, h3, h4, h5, h6 { font-family: sans-serif !important; font-weight: bold !important; } a { color: #000 !important; text-decoration: underline !important; } html { background: none !important; } body { background: #fff !important; box-shadow: none !important; } } /* 媒体查询,适应不同设备 - 调整基础字号 */ @media screen and (max-width: 768px) { :root { --base-font-size-px: 15; /* 小屏幕也用16px */ --ui-font-size-px: 12; } body { padding: 1rem; margin: 0.5rem; min-height: calc(100vh - 1rem); } } @media screen and (min-width: 1440px) { :root { --base-font-size-px: 16; --ui-font-size-px: 12; } } /* 边栏样式 - 增强质感 */ .side-block { background: linear-gradient(135deg, rgba(45, 65, 50, 0.92), rgba(35, 55, 40, 0.95)); /* 对角渐变 */ border: 1px solid rgba(90, 255, 150, 0.35); border-radius: 5px; margin: 0.5rem 0.5rem 1rem 0; padding: 0.6rem; box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(90, 255, 150, 0.1), inset 0 0 20px rgba(90, 255, 150, 0.07); font-family: var(--font-ui); } .side-block .heading { font-family: var(--font-title); font-size: calc(var(--ui-font-size-px) * 1px); color: #e0f8e8; text-shadow: var(--crt-text-shadow); padding: 0.6rem 0.8rem; margin: -0.6rem -0.6rem 0.6rem -0.6rem; border-bottom: 1px solid rgba(90, 255, 150, 0.3); background: linear-gradient(to bottom, rgba(90, 255, 150, 0.15), rgba(90, 255, 150, 0.08)); border-top-left-radius: 4px; border-top-right-radius: 4px; letter-spacing: 0.08em; text-transform: uppercase; } .side-block div.menu-item { margin: 0 -0.6rem; border-bottom: 1px solid rgba(90, 255, 150, 0.1); } .side-block div.menu-item:last-child { border-bottom: none; border-bottom-left-radius: 4px; /* 匹配容器圆角 */ border-bottom-right-radius: 4px; overflow: hidden; /* 隐藏溢出 */ } .side-block div.menu-item a { display: block; padding: 0.6rem 1.2rem; color: #a8d8b8; /* 菜单项颜色 */ text-decoration: none; font-size: calc(var(--ui-font-size-px) * 1px); transition: background-color 0.15s ease, color 0.15s ease, text-shadow 0.15s ease; text-shadow: none; position: relative; } .side-block div.menu-item a::before { /* 添加悬停指示器 */ content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background-color: #7bf0a0; opacity: 0; transition: opacity 0.2s ease; } .side-block div.menu-item a:hover { background-color: rgba(90, 255, 150, 0.08); color: #e8f8e8; /* 悬停变亮 */ text-shadow: 0 0 5px rgba(120, 255, 180, 0.4); } .side-block div.menu-item a:hover::before { opacity: 1; } /* 移除hovers库样式 - 如果不再需要 */ /* [class*='hovers-'] { display: none; } */
返回
Common.css
。
工具
链入页面
相关更改
特殊页面
页面信息
Cargo数据