MediaWiki:Common.css
注意:在您發布之後,您可能需要清除瀏覽器快取才能看到變更。
- Firefox或Safari:按住Shift時點擊重新整理,或按Ctrl-F5或Ctrl-R(Mac則為⌘-R)
- Google Chrome:按Ctrl-Shift-R(Mac則為⌘-Shift-R)
- Edge:按住Ctrl時點擊重新整理,或按Ctrl-F5。
/* =========================================================
Encyclato 全站樣式
維基經典風格
目錄
1. 資訊面板本體
2. 資訊面板標題
3. 分區標題
4. 欄名與內容
5. 圖像與簽名
6. 國旗與國徽
7. 格言與國歌
8. 歷代國旗與國徽(摺疊)
9. 任期與前任繼任
10. 跨欄內容、備註與頁尾
11. 數值警告與分級
12. 政黨色
13. 維基標準表格
14. 歷史朝代資訊面板
15. 主條目提示(hatnote)
16. 導覽框(navbox)
17. 前後任接續框
18. 公文與御批
19. 參考文獻與輔助類別
20. 窄螢幕
21. 夜間模式
22. 列印
========================================================= */
/* =========================================================
1. 資訊面板本體
========================================================= */
table.encyclato-infobox {
float: right !important;
clear: right !important;
width: 22em;
max-width: calc(100% - 1em);
margin: 0.5em 0 0.5em 1em !important;
padding: 0.2em;
border: 1px solid #a2a9b1;
border-collapse: separate !important;
border-spacing: 3px !important;
background-color: #f8f9fa;
color: #202122;
font-size: 88%;
line-height: 1.5em;
box-sizing: border-box;
}
table.encyclato-infobox + table.encyclato-infobox {
clear: right;
}
table.encyclato-infobox > tbody > tr > th,
table.encyclato-infobox > tbody > tr > td {
padding: 0.2em 0.4em;
border: 0;
vertical-align: top;
}
table.encyclato-infobox p {
margin: 0;
}
table.encyclato-infobox ul,
table.encyclato-infobox ol {
margin-top: 0;
margin-bottom: 0;
}
table.encyclato-infobox img {
max-width: 100%;
height: auto;
}
table.encyclato-infobox small {
font-size: 90%;
}
/* 空白列 */
table.encyclato-infobox > tbody > tr.infobox-hidden {
display: none !important;
}
/* =========================================================
2. 資訊面板標題
caption:艦級、車輛等面板
infobox-banner:國家、人物、政黨等面板
========================================================= */
table.encyclato-infobox > caption,
table.encyclato-infobox > tbody > tr > th.infobox-banner {
padding: 0.2em 0.4em 0.3em;
background: transparent;
color: #202122;
font-family: 'Linux Libertine', 'Georgia', 'Times', 'Noto Serif TC', 'Source Han Serif TC', 'Songti TC', 'PMingLiU', serif;
font-size: 125%;
font-weight: bold;
line-height: 1.3em;
text-align: center;
}
table.encyclato-infobox .infobox-banner-title {
font-size: 100%;
}
table.encyclato-infobox .infobox-native-name,
table.encyclato-infobox .infobox-banner-native {
margin-top: 0.1em;
font-size: 80%;
font-weight: normal;
}
table.encyclato-infobox .infobox-banner-role {
margin-top: 0.15em;
font-family: sans-serif;
font-size: 72%;
font-weight: bold;
}
table.encyclato-infobox .infobox-banner-sub {
margin-top: 0.2em;
font-family: sans-serif;
font-size: 68%;
font-weight: normal;
}
/* 國家或政黨狀態:斜體小字 */
table.encyclato-infobox .infobox-status-wrap {
margin-top: 0.15em;
font-family: sans-serif;
font-size: 68%;
font-weight: normal;
}
table.encyclato-infobox .infobox-status {
font-style: italic;
}
table.encyclato-infobox .infobox-status-active {
color: #14866d;
}
table.encyclato-infobox .infobox-status-defunct {
color: #54595d;
}
/* =========================================================
3. 分區標題
========================================================= */
table.encyclato-infobox > tbody > tr > th.infobox-section {
padding: 0.2em 0.4em;
border: 0 !important;
background-color: #eaecf0;
font-weight: bold;
text-align: center;
}
/* 次級標題,例如人物面板的職務名稱 */
table.encyclato-infobox > tbody > tr > th.infobox-subsection {
padding: 0.2em 0.4em;
border: 0 !important;
background-color: #e6e6fa;
font-weight: bold;
text-align: center;
}
/* =========================================================
4. 欄名與內容
========================================================= */
table.encyclato-infobox > tbody > tr > th.infobox-label {
width: auto;
padding-right: 0.65em;
background: transparent;
font-weight: bold;
text-align: left;
white-space: nowrap;
}
table.encyclato-infobox > tbody > tr > th.infobox-label + td {
background: transparent;
text-align: left;
overflow-wrap: anywhere;
}
/* 四字以內的欄名兩端對齊 */
table.encyclato-infobox .infobox-label-text {
display: inline-block;
width: 4em;
text-align: justify;
text-align-last: justify;
text-justify: inter-character;
}
/* 職稱、建立事件等自訂欄名允許換行 */
table.encyclato-infobox > tbody > tr > th.infobox-label-dynamic {
white-space: normal;
}
/* 第二行的補充資訊,例如出生地 */
table.encyclato-infobox .infobox-subline {
display: block;
}
/* 年份與排名:括號小字 */
table.encyclato-infobox .infobox-year,
table.encyclato-infobox .infobox-rank {
margin-left: 0.2em;
color: #54595d;
font-size: 90%;
white-space: nowrap;
}
table.encyclato-infobox .infobox-year::before,
table.encyclato-infobox .infobox-rank::before {
content: "(";
}
table.encyclato-infobox .infobox-year::after,
table.encyclato-infobox .infobox-rank::after {
content: ")";
}
/* =========================================================
5. 圖像與簽名
========================================================= */
table.encyclato-infobox .infobox-image-cell,
table.encyclato-infobox .infobox-portrait-cell,
table.encyclato-infobox .infobox-map-cell,
table.encyclato-infobox .infobox-wide-image {
padding: 0.4em 0.2em;
text-align: center;
vertical-align: middle;
}
table.encyclato-infobox .infobox-portrait-caption,
table.encyclato-infobox .infobox-map-caption {
margin-top: 0.2em;
font-size: 94%;
line-height: 1.4em;
}
table.encyclato-infobox .infobox-signature-cell {
padding: 0.4em 0.2em;
text-align: center;
}
table.encyclato-infobox .infobox-signature-label {
display: block;
font-weight: bold;
}
table.encyclato-infobox .infobox-signature-cell img {
max-width: 150px;
max-height: 80px;
width: auto;
}
/* =========================================================
6. 國旗與國徽
========================================================= */
table.encyclato-infobox .infobox-emblem-cell,
table.encyclato-infobox .infobox-symbol-cell {
width: 50%;
padding: 0.4em 0.2em;
text-align: center;
vertical-align: bottom;
}
table.encyclato-infobox .infobox-emblem-media,
table.encyclato-infobox .infobox-symbol-media {
line-height: 0;
}
table.encyclato-infobox .infobox-flag-media img {
border: 1px solid #c8ccd1;
}
table.encyclato-infobox .infobox-emblem-name,
table.encyclato-infobox .infobox-symbol-name {
display: block;
margin-top: 0.2em;
font-size: 94%;
font-weight: normal;
}
table.encyclato-infobox .infobox-emblem-meta {
display: block;
color: #54595d;
font-size: 85%;
line-height: 1.4em;
}
/* 舊版國旗列的多餘換行修正 */
table.encyclato-infobox tr.infobox-symbol-row br:first-child,
table.encyclato-infobox tr.infobox-symbol-row br:last-child {
display: none;
}
/* =========================================================
7. 格言與國歌
========================================================= */
table.encyclato-infobox .infobox-motto-cell {
padding: 0.3em 0.4em;
text-align: center;
}
table.encyclato-infobox .infobox-motto-line {
margin: 0.1em 0;
}
table.encyclato-infobox .infobox-motto-label {
margin-right: 0.3em;
font-weight: bold;
}
table.encyclato-infobox .infobox-motto-label::after {
content: ":";
}
/* =========================================================
8. 歷代國旗與國徽(摺疊)
========================================================= */
table.encyclato-infobox .infobox-history-cell {
padding: 0.2em 0.4em;
}
table.encyclato-infobox .infobox-history-title {
font-weight: bold;
text-align: center;
}
table.encyclato-infobox .mw-collapsible-toggle {
float: right;
font-weight: normal;
}
table.encyclato-infobox .infobox-history-item {
display: flex;
align-items: flex-end;
gap: 0.4em;
padding: 0.4em 0 0.2em;
}
table.encyclato-infobox .infobox-history-col {
flex: 1 1 50%;
text-align: center;
}
/* =========================================================
9. 任期與前任繼任
========================================================= */
table.encyclato-infobox .infobox-term-cell {
padding: 0.1em 0.4em 0.3em;
text-align: center;
}
table.encyclato-infobox .infobox-succession-cell {
width: 50%;
padding: 0.2em 0.4em;
text-align: center;
vertical-align: top;
}
table.encyclato-infobox .infobox-succession-label {
display: block;
font-weight: bold;
}
/* =========================================================
10. 跨欄內容、備註與頁尾
========================================================= */
table.encyclato-infobox .infobox-wide-cell {
padding: 0.2em 0.4em;
text-align: left;
}
table.encyclato-infobox .infobox-note {
padding: 0.3em 0.4em;
font-size: 90%;
text-align: left;
}
table.encyclato-infobox .infobox-footer-cell {
padding: 0.3em 0.4em;
text-align: center;
}
table.encyclato-infobox .infobox-footer-line + .infobox-footer-line {
margin-top: 0.1em;
}
table.encyclato-infobox .infobox-footer-label {
margin-right: 0.3em;
font-weight: bold;
}
table.encyclato-infobox .infobox-footer-label::after {
content: ":";
}
/* =========================================================
11. 數值警告與分級
不限定在資訊面板內,一般表格也可使用
========================================================= */
.infobox-warning {
margin-left: 0.3em;
color: #d33;
font-size: 85%;
font-weight: bold;
white-space: nowrap;
}
.infobox-value-invalid {
color: #d33;
}
.infobox-grade::after {
margin-left: 0.35em;
font-weight: bold;
}
/* 人類發展指數:越高越好 */
.infobox-hdi-1::after { content: "極高"; color: #006400; }
.infobox-hdi-2::after { content: "高"; color: #2e8b57; }
.infobox-hdi-3::after { content: "中"; color: #b8860b; }
.infobox-hdi-4::after { content: "低"; color: #b22222; }
/* 基尼係數:越低越平均 */
.infobox-gini-1::after { content: "極低"; color: #006400; }
.infobox-gini-2::after { content: "低"; color: #2e8b57; }
.infobox-gini-3::after { content: "中等"; color: #b8860b; }
.infobox-gini-4::after { content: "高"; color: #cc5500; }
.infobox-gini-5::after { content: "極高"; color: #b22222; }
/* =========================================================
12. 政黨色
party-bar-*:表頭上緣色條
party-bg-*:執政或當選儲存格的淡色底
party-swatch-*:文字前的小色塊
========================================================= */
/* 紫荊政友會 */
.party-bar-zijing { border-top: 4px solid #6b4a8b !important; }
.party-bg-zijing { background-color: #efe7f5 !important; }
.party-swatch-zijing { background-color: #6b4a8b; }
/* 中央黨(3701-3731) */
.party-bar-zhongyang { border-top: 4px solid #8a6aa8 !important; }
.party-bg-zhongyang { background-color: #f3edf8 !important; }
.party-swatch-zhongyang { background-color: #8a6aa8; }
/* 日月新潮流 */
.party-bar-riyue { border-top: 4px solid #c9a227 !important; }
.party-bg-riyue { background-color: #fbf3d9 !important; }
.party-swatch-riyue { background-color: #c9a227; }
/* 中間派 */
.party-bar-zhongjian { border-top: 4px solid #9aa0a6 !important; }
.party-bg-zhongjian { background-color: #eeeeee !important; }
.party-swatch-zhongjian { background-color: #9aa0a6; }
/* 聯合政府 */
.party-bg-coalition { background-color: #eeeeee !important; }
/* 其他與無黨籍 */
.party-bar-other { border-top: 4px solid #c8ccd1 !important; }
.party-swatch-other { background-color: #c8ccd1; }
/* 色塊共用樣式 */
[class*="party-swatch-"] {
display: inline-block;
width: 0.9em;
height: 0.9em;
margin-right: 0.3em;
border: 1px solid #a2a9b1;
vertical-align: -0.1em;
}
/* =========================================================
13. 維基標準表格
========================================================= */
table.wikitable {
margin: 1em 0;
border: 1px solid #a2a9b1;
border-collapse: collapse;
background-color: #f8f9fa;
color: #202122;
}
table.wikitable > * > tr > th,
table.wikitable > * > tr > td {
padding: 0.2em 0.4em;
border: 1px solid #a2a9b1;
}
table.wikitable > * > tr > th {
background-color: #eaecf0;
text-align: center;
}
table.wikitable > caption {
padding: 0.2em 0;
font-weight: bold;
}
/* 列標題不加粗、靠左 */
table.wikitable.plainrowheaders > * > tr > th[scope="row"] {
font-weight: normal;
text-align: left;
}
/* 合計列固定在底部,不參與排序 */
table.wikitable > * > tr.sortbottom > th,
table.wikitable > * > tr.sortbottom > td {
background-color: #eaecf0;
font-weight: bold;
}
/* 數字欄靠右 */
table.wikitable .num {
text-align: right;
white-space: nowrap;
}
/* 置中表格 */
table.wikitable.center {
margin-left: auto;
margin-right: auto;
}
/* 全寬表格 */
table.wikitable.fullwidth {
width: 100%;
}
/* =========================================================
14. 歷史朝代資訊面板
模板:歷史朝代資訊面板
========================================================= */
table.dynasty-info-table {
width: 100%;
margin: 1em 0;
border: 1px solid #a2a9b1;
border-collapse: collapse;
border-spacing: 0;
background: #fff;
color: #202122;
font-size: 95%;
line-height: 1.45;
}
table.dynasty-info-table > caption {
padding: 0.55em 0.7em;
border: 1px solid #a2a9b1;
border-bottom: 0;
background: #eaecf0;
font-size: 125%;
font-weight: 700;
text-align: center;
}
table.dynasty-info-table > tbody > tr > th,
table.dynasty-info-table > tbody > tr > td {
padding: 0.42em 0.6em;
border: 1px solid #c8ccd1;
vertical-align: middle;
}
table.dynasty-info-table > tbody > tr.dynasty-info-head > th {
background: #eaecf0;
font-weight: 700;
text-align: center;
}
table.dynasty-info-table .dynasty-col-period { width: 12%; }
table.dynasty-info-table .dynasty-col-name { width: 16%; }
table.dynasty-info-table .dynasty-col-date { width: 19%; }
table.dynasty-info-table .dynasty-col-story { width: 53%; }
table.dynasty-info-table .dynasty-period {
background: #f1f3f5;
font-weight: 700;
text-align: center;
vertical-align: middle;
}
table.dynasty-info-table .dynasty-name {
background: #fff;
font-weight: 600;
text-align: center;
}
table.dynasty-info-table .dynasty-date {
background: #fff;
text-align: center;
white-space: nowrap;
}
table.dynasty-info-table .dynasty-story {
background: #fff;
text-align: left;
}
table.dynasty-info-table > tbody > tr.dynasty-data-row:hover > td,
table.dynasty-info-table > tbody > tr.dynasty-data-row:hover > th {
background-color: #f8f9fa;
}
table.dynasty-info-table > tbody > tr.dynasty-hidden {
display: none;
}
/* =========================================================
15. 主條目提示(hatnote)
用法:<div class="hatnote">另請參閱主條目:[[大奭學制]]</div>
========================================================= */
.hatnote {
margin-bottom: 0.5em;
padding-left: 1.6em;
font-style: italic;
}
.hatnote i {
font-style: normal;
}
.hatnote + .hatnote {
margin-top: -0.5em;
}
/* =========================================================
16. 導覽框(navbox)
置於條目底部,串連同一主題的條目
========================================================= */
table.navbox {
clear: both;
width: 100%;
margin: 1em auto 0;
padding: 1px;
border: 1px solid #a2a9b1;
border-spacing: 0;
background-color: #fdfdfd;
font-size: 88%;
text-align: center;
}
table.navbox + table.navbox {
margin-top: -1px;
}
table.navbox .navbox-title {
padding: 0.25em 1em;
background-color: #ccccff;
font-size: 114%;
font-weight: bold;
}
table.navbox .navbox-group {
width: 1%;
padding: 0.25em 1em;
background-color: #ddddff;
font-weight: bold;
text-align: right;
white-space: nowrap;
}
table.navbox .navbox-list {
padding: 0.25em 0.5em;
border-left: 2px solid #fdfdfd;
text-align: left;
line-height: 1.6em;
}
table.navbox .navbox-even {
background-color: #f7f7f7;
}
table.navbox .navbox-odd {
background-color: transparent;
}
/* 清單項目以「・」分隔 */
table.navbox .navbox-list ul {
display: inline;
margin: 0;
padding: 0;
list-style: none;
}
table.navbox .navbox-list li {
display: inline;
margin: 0;
}
table.navbox .navbox-list li + li::before {
content: "・";
padding: 0 0.1em;
font-weight: bold;
}
/* =========================================================
17. 前後任接續框
用於人物條目底部,標示前任與繼任
========================================================= */
table.succession-box {
clear: both;
width: 100%;
margin: 1em auto 0;
border: 1px solid #a2a9b1;
border-collapse: collapse;
background-color: #f8f9fa;
font-size: 90%;
text-align: center;
}
table.succession-box > * > tr > th,
table.succession-box > * > tr > td {
padding: 0.3em 0.6em;
border: 1px solid #a2a9b1;
}
table.succession-box > * > tr > th {
background-color: #eaecf0;
}
table.succession-box .succession-before,
table.succession-box .succession-after {
width: 30%;
}
table.succession-box .succession-title {
width: 40%;
font-weight: bold;
}
/* =========================================================
18. 公文與御批
用於呈現奏摺、政牒、咨牒、札等公文原文
========================================================= */
.encyclato-document {
max-width: 48em;
margin: 1em 0;
padding: 1em 1.4em;
border: 1px solid #c8b99a;
background-color: #fbf8f1;
color: #202122;
font-family: 'Noto Serif TC', 'Source Han Serif TC', 'Songti TC', 'PMingLiU', serif;
line-height: 1.9;
}
.encyclato-document .doc-title {
margin-bottom: 0.6em;
font-size: 110%;
font-weight: bold;
text-align: center;
}
.encyclato-document .doc-route {
margin-bottom: 0.8em;
color: #54595d;
font-size: 90%;
text-align: center;
}
.encyclato-document .doc-body p {
margin: 0.4em 0;
text-indent: 2em;
}
/* 挪抬:於敬稱前自動空一格 */
.encyclato-document .doc-honor::before {
content: "\3000";
}
/* 落款與文號 */
.encyclato-document .doc-sign {
margin-top: 1em;
color: #202122;
text-align: right;
}
.encyclato-document .doc-number {
color: #54595d;
font-size: 90%;
text-align: right;
}
/* 御批:硃筆 */
.encyclato-document .doc-vermilion,
.doc-vermilion {
color: #b8262b;
font-family: 'DFKai-SB', 'BiauKai', 'Kaiti TC', 'STKaiti', 'KaiTi', serif;
font-size: 112%;
font-weight: bold;
}
.encyclato-document .doc-vermilion-block {
margin-top: 1em;
padding-top: 0.6em;
border-top: 1px dashed #c8b99a;
}
/* =========================================================
19. 參考文獻與輔助類別
========================================================= */
.reflist {
margin-bottom: 0.5em;
font-size: 90%;
column-width: 30em;
}
.reflist ol.references {
margin-top: 0;
}
.nowrap {
white-space: nowrap;
}
.plainlist ul {
margin: 0;
padding: 0;
list-style: none;
}
.plainlist li {
margin-bottom: 0;
}
.muted {
color: #54595d;
}
/* =========================================================
20. 窄螢幕
========================================================= */
@media screen and (max-width: 720px) {
table.wikitable,
table.succession-box {
display: block;
overflow-x: auto;
}
table.navbox .navbox-group {
white-space: normal;
}
.encyclato-document {
padding: 0.8em 1em;
}
}
@media screen and (max-width: 520px) {
table.encyclato-infobox {
width: 20em;
max-width: calc(100% - 0.5em);
margin: 0.5em 0 0.5em 0.6em !important;
}
}
/* =========================================================
21. 夜間模式
適用 MediaWiki 1.43 以後的 Vector 2022 外觀
========================================================= */
@media screen {
html.skin-theme-clientpref-night table.encyclato-infobox,
html.skin-theme-clientpref-night table.wikitable,
html.skin-theme-clientpref-night table.succession-box,
html.skin-theme-clientpref-night table.dynasty-info-table {
border-color: #72777d;
background-color: #1b1d20;
color: #eaecf0;
}
html.skin-theme-clientpref-night table.encyclato-infobox > caption,
html.skin-theme-clientpref-night table.encyclato-infobox th.infobox-banner {
color: #eaecf0;
}
html.skin-theme-clientpref-night table.encyclato-infobox th.infobox-section,
html.skin-theme-clientpref-night table.wikitable > * > tr > th,
html.skin-theme-clientpref-night table.succession-box > * > tr > th,
html.skin-theme-clientpref-night table.dynasty-info-table th {
background-color: #2a2d31;
color: #eaecf0;
}
html.skin-theme-clientpref-night table.encyclato-infobox th.infobox-subsection {
background-color: #2e2b45;
}
html.skin-theme-clientpref-night table.wikitable > * > tr > th,
html.skin-theme-clientpref-night table.wikitable > * > tr > td,
html.skin-theme-clientpref-night table.dynasty-info-table td {
border-color: #72777d;
}
html.skin-theme-clientpref-night table.dynasty-info-table td {
background-color: #1b1d20;
}
html.skin-theme-clientpref-night .encyclato-document {
border-color: #6b5f47;
background-color: #22201b;
color: #eaecf0;
}
html.skin-theme-clientpref-night .doc-vermilion {
color: #ff6b6b;
}
html.skin-theme-clientpref-night table.navbox {
background-color: #1b1d20;
}
html.skin-theme-clientpref-night table.navbox .navbox-title {
background-color: #3a3a66;
}
html.skin-theme-clientpref-night table.navbox .navbox-group {
background-color: #2e2e52;
}
html.skin-theme-clientpref-night table.navbox .navbox-even {
background-color: #232528;
}
html.skin-theme-clientpref-night .party-bg-zijing { background-color: #3a2d47 !important; }
html.skin-theme-clientpref-night .party-bg-zhongyang { background-color: #3d3148 !important; }
html.skin-theme-clientpref-night .party-bg-riyue { background-color: #45391a !important; }
html.skin-theme-clientpref-night .party-bg-zhongjian,
html.skin-theme-clientpref-night .party-bg-coalition { background-color: #34373b !important; }
}
/* =========================================================
22. 列印
========================================================= */
@media print {
table.encyclato-infobox {
border-color: #000;
background: #fff !important;
}
table.navbox,
.mw-collapsible-toggle {
display: none !important;
}
.encyclato-document {
border-color: #000;
background: #fff;
}
}