首页
最近更改
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=VT323&display=swap"); @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"); :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: #eaecf0; --custom-topic-30-days: #bbb; --custom-topic-7-days: #ddd; /* CRT效果相关变量 - 增强效果 */ --crt-scanline-alpha: 0.15; --crt-flicker-alpha: 0.05; --crt-noise-alpha: 0.03; --crt-glow-radius: 0.1em; --crt-glow-color: rgba(0, 255, 50, 0.25); /* 网格背景相关变量 */ --grid-color: rgba(0, 0, 0, 0.1); --grid-size: 30px; --grid-line-width: 1px; /* 字体设置 */ --pixel-font: 'VT323', 'VonwaonBitmap 16px', monospace; --body-font: var(--pixel-font), Verdana, "Microsoft YaHei", "微软雅黑", Geneva, sans-serif; --UI-font: var(--pixel-font), "方体", "PingFang SC", "黑体", "Heiti SC", sans-serif; --title-font: var(--pixel-font); /* 字体大小设置 */ --base-font-size: 16px; --chinese-scale: 1.2; --heading-scale: 1.5; --code-scale: 0.85; /* 边框和内间距设置 */ --side-border-thickness: 0.125rem; --main-border-thickness: 0.0625rem; /* 启用/禁用扫描线效果 */ --scanlines-display: block; } /* 基础CRT效果:扫描线和荧光效果 */ @keyframes flicker { 0% { opacity: 0.97; } 5% { opacity: 0.93; } 10% { opacity: 0.98; } 15% { opacity: 0.94; } 20% { opacity: 0.96; } 25% { opacity: 0.98; } 30% { opacity: 0.93; } 35% { opacity: 0.97; } 40% { opacity: 0.99; } 45% { opacity: 0.94; } 50% { opacity: 0.98; } 55% { opacity: 0.93; } 60% { opacity: 0.97; } 65% { opacity: 0.98; } 70% { opacity: 0.94; } 75% { opacity: 0.96; } 80% { opacity: 0.99; } 85% { opacity: 0.96; } 90% { opacity: 0.98; } 95% { opacity: 0.94; } 100% { opacity: 0.97; } } @keyframes scanlines { 0% { transform: translateY(0); } 100% { transform: translateY(4px); } } @keyframes crt-on { 0% { opacity: 0; transform: scale(0.8) translateY(10px); filter: brightness(3) saturate(0); } 30% { opacity: 1; filter: brightness(2) saturate(0.3); } 100% { transform: scale(1) translateY(0); filter: brightness(1) saturate(1); } } /* 网格背景和全局样式 */ html { min-height: 100%; background-color: #ffffff; 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)); background-size: var(--grid-size) var(--grid-size); background-position: center center; animation: crt-on 1.5s ease-out; } body { font-family: var(--body-font); font-size: var(--base-font-size); line-height: 1.6; position: relative; min-height: 100vh; margin: 0; padding: 1rem; background-color: rgba(255, 255, 255, 0.85); border-radius: 5px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.1), 0 0 15px var(--crt-glow-color), inset 0 0 20px rgba(0, 255, 50, 0.05); animation: flicker 120s infinite; } /* 扫描线效果 - 更明显但不干扰阅读 */ body::before { content: ""; display: var(--scanlines-display); position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient( to bottom, transparent 0%, rgba(0, 0, 0, var(--crt-scanline-alpha)) 50%, transparent 51%, rgba(0, 0, 0, var(--crt-scanline-alpha)) 100% ); background-size: 100% 4px; pointer-events: none; z-index: 9999; animation: scanlines 6s linear infinite; opacity: 0.7; mix-blend-mode: overlay; } /* 噪点效果 - 更明显 */ body::after { content: ""; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAABmJLR0QA/wD/AP+gvaeTAAAA30lEQVRoge2awQ6EIAxFX/z/f3a+gImDLW2BZu4s7knYNbS9KSoRQojf5SQRzcyGNUlEs9a2zJukSJKkSDIXeWQ+kczkSsIid5GvJUYlL0WsRaxFDCVkLyMiIiJbYvn5S8xYJftGzKyltfaWsKbNeZ7dHTPXvRFJmUlZZEhERNZkSLJL8B1Zkax7Qkbk8J9vGZZhmqwYlmGarBiWYZqsGJZhmqwYlmGarBiWYZqsGJZhmqwYlmGarBiWYZqsGJZhmqwYlmGarBiWYZqsGJZhmqwYlmGarPwoJCIiciUfhRl8e00EGUAAAAAASUVORK5CYII="); background-size: 100px 100px; pointer-events: none; opacity: var(--crt-noise-alpha); z-index: 9998; mix-blend-mode: overlay; } /* CRT启动动画 */ .crt-startup { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; z-index: 10000; animation: crt-startup 2s forwards; pointer-events: none; } @keyframes crt-startup { 0% { opacity: 1; } 70% { opacity: 1; } 100% { opacity: 0; visibility: hidden; } } /* 标题样式 - 增强CRT效果 */ h1, h2, h3, h4, h5, h6 { font-family: var(--title-font); font-size: calc(var(--base-font-size) * var(--heading-scale)); font-weight: normal; text-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color), 0 0 calc(var(--crt-glow-radius) * 2) var(--crt-glow-color), 0 0 calc(var(--crt-glow-radius) * 3) var(--crt-glow-color); letter-spacing: 0.05em; position: relative; margin-top: 1.5em; margin-bottom: 0.8em; padding-left: 0.5em; border-left: 3px solid var(--crt-glow-color); } h1::after, h2::after, h3::after { content: ""; position: absolute; bottom: -5px; left: 0; width: 100%; height: 1px; background: linear-gradient(to right, var(--crt-glow-color), transparent); } body h1 { font-family: var(--title-font) !important; color: #333; text-transform: uppercase; font-size: calc(var(--base-font-size) * 2); } h2 { font-size: calc(var(--base-font-size) * 1.8); } h3 { font-size: calc(var(--base-font-size) * 1.6); } h4 { font-size: calc(var(--base-font-size) * 1.4); } h5, h6 { font-size: calc(var(--base-font-size) * 1.2); } /* 链接样式 - 更科幻的风格 */ a { color: var(--link-color); text-decoration: none; position: relative; transition: color 0.2s ease, text-shadow 0.2s ease; padding: 0 2px; } a:hover { color: var(--link-color-active); text-shadow: 0 0 var(--crt-glow-radius) rgba(250, 167, 0, 0.3), 0 0 calc(var(--crt-glow-radius) * 2) rgba(250, 167, 0, 0.2); background-color: rgba(250, 167, 0, 0.05); border-radius: 2px; } a::after { content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 1px; background-color: var(--link-color-active); transition: width 0.3s ease; } a:hover::after { width: 100%; } a.new { color: #ba0000; } /* Infobox样式 - 更明显的CRT效果 */ .notaninfobox { position: relative; clear: right; margin: 0 0 1em 1em; width: 350px; font-size: 90%; background-color: var(--custom-table-background); float: right; border: 1px solid var(--custom-border-gray); padding: 2px; overflow: auto; z-index: 1; overflow-wrap: anywhere; box-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color), 0 0 calc(var(--crt-glow-radius) * 3) rgba(0, 255, 50, 0.1); animation: flicker 60s infinite; border-radius: 3px; } @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(--title-font); font-weight: normal; text-align: center; font-size: 120%; background-color: var(--custom-mcwiki-header-color); text-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color); padding: 5px 2px; position: relative; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .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(--pixel-font); font-weight: normal; display: flex; align-items: center; text-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color); } .notaninfobox .infobox-rows .infobox-row:nth-child(2n) .infobox-row-label, .notaninfobox .infobox-rows .infobox-row:nth-child(2n) .infobox-row-field { background-color: var(--custom-table-alternate-background); } /* 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(--pixel-font); } .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(--pixel-font); text-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color); } /* 页面底部导航框(2011年8月16日引自中文维基)(所谓大家族模板) */ table.navbox{ border: 1px solid #aaa; clear: both; margin: auto; padding: 1px; text-align: center; width: 100%; box-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color); } table.navbox + table.navbox{ margin-top: -1px; } .navbox-title, .navbox-abovebelow, table.navbox th{ padding-left: 1em; padding-right: 1em; text-align: center; font-family: var(--pixel-font); } .navbox-group{ font-weight: normal; white-space: nowrap; font-family: var(--pixel-font); } .navbox, .navbox-subgroup{ background: none repeat scroll 0 0 var(--theme-card-background-color, #fdfdfd); } .navbox-list{ border-color: #fdfdfd; } .navbox-title, table.navbox th{ background: none repeat scroll 0 0 #a5e4a5; text-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color); } .navbox-abovebelow, .navbox-group, .navbox-subgroup .navbox-title{ background: none repeat scroll 0 0 #c0ecc0; text-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color); } .navbox-subgroup .navbox-group, .navbox-subgroup .navbox-abovebelow{ background: none repeat scroll 0 0 #e6f6e6; } .navbox-even{ background: none repeat scroll 0 0 #f5fcf5; } .navbox-odd{ background: none repeat scroll 0 0 #fdfdfd; } .collapseButton { float: right; font-weight: 400; text-align: right; width: auto; } .navbox .collapseButton { width: 6em; } .navbar { position: relative; min-height: 23px !important; margin-bottom: 0px !important; border: 1px solid transparent; } .navbox-title .Wikiplus-Edit-EveryWhereBtn { display: none; } @media only screen and (max-width:759px){ .infotable { width: 90%; float: none; margin: 0 auto; } .navbox-title>div{ display: none; } .navbox-group, .navbox-group >div{ padding-left: 0 !important; padding-right: 0 !important; text-align: center; } } /* 黑幕效果 */ .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; } /* 表格样式 - 增强CRT效果 */ table { border-collapse: collapse; background-color: var(--custom-table-background); box-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color), 0 0 15px rgba(0, 0, 0, 0.05); border-radius: 3px; margin: 1em 0; } table th { background-color: var(--custom-table-header-background); font-family: var(--pixel-font); font-weight: normal; text-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color); padding: 8px 12px; position: relative; } table td, table th { border: 1px solid var(--custom-border-gray); padding: 0.25em 0.5em; transition: background-color 0.2s ease; font-size: calc(var(--base-font-size) * 0.9); } table tr:hover td { background-color: rgba(0, 255, 50, 0.05); } /* 代码样式 - 更科技感 */ pre, code { font-family: var(--pixel-font); font-size: calc(var(--base-font-size) * var(--code-scale)); background-color: var(--custom-code-background); border: 1px solid var(--custom-border-gray); padding: 0.2em 0.4em; text-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color); border-radius: 3px; } pre { padding: 1em; overflow-x: auto; background-color: rgba(0, 0, 0, 0.03); position: relative; } pre::before { content: "CODE"; position: absolute; top: 0; right: 0; font-size: 10px; background-color: rgba(0, 0, 0, 0.1); padding: 2px 8px; color: #666; border-bottom-left-radius: 4px; } /* 确保文本内容在荧光字体下清晰可读 */ p, li, td, th, figcaption, blockquote, cite { font-family: var(--pixel-font); font-size: var(--base-font-size); line-height: 1.6; letter-spacing: 0.02em; position: relative; } /* 图片效果 - 增强 */ img { max-width: 100%; height: auto; transition: all 0.3s ease; border-radius: 3px; border: 1px solid transparent; } img:hover { box-shadow: 0 0 var(--crt-glow-radius) var(--crt-glow-color), 0 0 calc(var(--crt-glow-radius) * 2) var(--crt-glow-color), 0 0 15px rgba(0, 0, 0, 0.1); transform: scale(1.01); border-color: rgba(0, 255, 50, 0.2); } /* 引入CRT启动效果 */ body::before { content: ""; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000; z-index: 10000; animation: startup 2s forwards; pointer-events: none; } @keyframes startup { 0% { opacity: 1; } 40% { opacity: 1; } 60% { opacity: 0.5; } 100% { opacity: 0; visibility: hidden; } } /* 滚动条样式 */ ::-webkit-scrollbar { width: 10px; height: 10px; } ::-webkit-scrollbar-track { background: rgba(0, 0, 0, 0.05); border-radius: 5px; } ::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.2); border-radius: 5px; border: 2px solid rgba(0, 0, 0, 0.05); } ::-webkit-scrollbar-thumb:hover { background: rgba(0, 0, 0, 0.3); } /* 修复扫描线显示问题 */ @media screen { :root { --scanlines-display: block; } /* 为了确保扫描线效果能够正常显示,添加一个额外的扫描线元素 */ body .scanlines { content: ""; display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: repeating-linear-gradient( to bottom, transparent 0px, rgba(0, 0, 0, 0.1) 1px, transparent 2px, transparent 4px ); pointer-events: none; z-index: 9997; opacity: 0.4; mix-blend-mode: overlay; } } /* 打印样式覆盖 */ @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; } } /* 添加扫描线DOM元素 */ body::after { content: ""; display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: repeating-linear-gradient( to bottom, transparent 0px, rgba(0, 0, 0, 0.07) 1px, transparent 2px, transparent 4px ); pointer-events: none; z-index: 9997; opacity: 0.5; mix-blend-mode: overlay; } /* 为含有中文的元素设置字体大小 */ :lang(zh), :lang(zh-CN), :lang(zh-TW), :lang(zh-HK) { font-size: calc(var(--base-font-size) * var(--chinese-scale)); } /* 媒体查询,适应不同设备 */ @media screen and (max-width: 768px) { :root { --base-font-size: 14px; } } @media screen and (min-width: 1440px) { :root { --base-font-size: 18px; } } /* 使用Press Start 2P时的特别设置 */ @supports (font-family: 'Press Start 2P') { :root { --pixel-font: 'VT323', 'VonwaonBitmap 16px', monospace; } h1, h2, h3, h4, h5, h6 { font-family: 'Press Start 2P', var(--pixel-font); letter-spacing: -0.05em; line-height: 1.4; } }
返回
Common.css
。
工具
链入页面
相关更改
特殊页面
页面信息
Cargo数据