MediaWiki:Common.css
外觀
注意:在您發布之後,您可能需要清除瀏覽器快取才能看到變更。
- Firefox或Safari:按住Shift時點擊重新整理,或按Ctrl-F5或Ctrl-R(Mac則為⌘-R)
- Google Chrome:按Ctrl-Shift-R(Mac則為⌘-Shift-R)
- Edge:按住Ctrl時點擊重新整理,或按Ctrl-F5。
/* 此 CSS 會套用至所有的介面外觀 */
/* 重置 <cite> 元素的斜体样式。
浏览器默认将 <cite> 渲染为斜体,这里重置为继承父元素样式,
避免 CS1/CS2 模板中的 cite 标签出现意外的斜体。 */
cite,
dfn {
font-style: inherit;
}
/* 参考文献列表(<references/> 或 {{reflist}} 生成的 .references 容器)
的底部外边距。 */
.references {
margin-bottom: 0.5em;
}
/* 初始化反向引用计数器 */
span[ rel="mw:referencedBy" ] {
counter-reset: mw-ref-linkback 0;
}
/* 单个引用被多次使用时,回跳链接用小写字母编号(a、b、c ...) */
span[ rel='mw:referencedBy' ] > a::before {
content: counter( mw-ref-linkback, lower-alpha );
font-size: 80%;
font-weight: bold;
font-style: italic;
}
/* 单个反向引用链接显示 "↑"(脱字符 ^)作为回跳箭头 */
a[ rel="mw:referencedBy" ]::before {
font-weight: bold;
content: "^";
}
/* 反向引用容器前缀为 "↑ "(箭头后带空格) */
span[ rel="mw:referencedBy" ]::before {
content: "^ ";
}
/* --------------------------------------------------------------------------
PDF 外部链接图标
-------------------------------------------------------------------------- */
.mw-parser-output a[href$=".pdf"].external,
.mw-parser-output a[href*=".pdf?"].external,
.mw-parser-output a[href*=".pdf#"].external,
.mw-parser-output a[href$=".PDF"].external,
.mw-parser-output a[href*=".PDF?"].external,
.mw-parser-output a[href*=".PDF#"].external {
background: url("//upload.wikimedia.org/wikipedia/commons/4/4d/Icon_pdf_file.png") no-repeat right;
padding: 8px 18px 8px 0;
}
/* --------------------------------------------------------------------------
屏幕媒体(非打印)下,缩小参考文献列表的字号。
需与 Template:Refbegin/styles.css 和 Template:Reflist/styles.css 保持一致。
-------------------------------------------------------------------------- */
@media screen {
.references {
font-size: 90%;
}
}
/* --------------------------------------------------------------------------
響應式設定。
-------------------------------------------------------------------------- */
/* ========== 全局響應式基礎 ========== */
:root {
--content-max-width: 1200px;
--mobile-breakpoint: 768px;
--tablet-breakpoint: 1024px;
}
.content-wrapper {
max-width: var(--content-max-width);
margin: 0 auto;
padding: 0 1rem;
}
/* ========== 桌面版(> 1024px) ========== */
@media screen and (min-width: 1025px) {
.sidebar-desktop {
display: block;
width: 280px;
float: right;
}
.infobox {
max-width: 350px;
}
}
/* ========== 平板版(768px - 1024px) ========== */
@media screen and (max-width: 1024px) and (min-width: 769px) {
.sidebar-desktop { width: 220px; }
.content-wrapper { padding: 0 1.5rem; }
}
/* ========== 手機版(< 768px) ========== */
@media screen and (max-width: 768px) {
/* 隱藏桌面專屬元素 */
.sidebar-desktop,
.desktop-only {
display: none !important;
}
/* 內容全寬 */
.content-wrapper,
.mw-parser-output {
padding: 0.5rem;
font-size: 16px; /* 避免 iOS 自動縮放 */
}
/* 表格橫向滾動 */
table.wikitable {
display: block;
overflow-x: auto;
white-space: nowrap;
}
/* 圖片自適應 */
img {
max-width: 100% !important;
height: auto !important;
}
}
/* ========== 小手機(< 480px) ========== */
@media screen and (max-width: 480px) {
body {
font-size: 15px;
line-height: 1.6;
}
h1 { font-size: 1.5rem; }
h2 { font-size: 1.3rem; }
}