MediaWiki:Common.css:修订间差异
外观
无编辑摘要 |
无编辑摘要 |
||
| 第10行: | 第10行: | ||
} | } | ||
th, td { | .infobox th, .infobox td { | ||
/* 添加边框使结构更清晰 */ | /* 添加边框使结构更清晰 */ | ||
border: 1px solid #ddd; | border: 1px solid #ddd; | ||
| 第17行: | 第17行: | ||
} | } | ||
th { | .infobox th { | ||
/* 可以给th设置一个最小宽度作为保底 */ | /* 可以给th设置一个最小宽度作为保底 */ | ||
min-width: 70px; | min-width: 70px; | ||
| 第25行: | 第25行: | ||
} | } | ||
caption { | .infobox caption { | ||
font-weight: bold; | font-weight: bold; | ||
margin-bottom: 8px; | margin-bottom: 8px; | ||
font-size: 1.2em; | font-size: 1.2em; | ||
} | |||
/* 移动端适配 */ | |||
@media (max-width: 768px) { | |||
.infobox { | |||
max-width: 100%; | |||
float: none; | |||
margin: 1em auto; | |||
font-size: 13px; | |||
} | |||
.infobox th, | |||
.infobox td { | |||
padding: 0.4em 0.6em; | |||
display: block; | |||
width: 100% !important; | |||
box-sizing: border-box; | |||
} | |||
.infobox th { | |||
background: #dde0e5; | |||
border-bottom: none; | |||
} | |||
.infobox td { | |||
border-top: none; | |||
} | |||
.infobox tr { | |||
display: block; | |||
margin-bottom: 0.5em; | |||
} | |||
} | |||
/* 小屏幕手机适配 */ | |||
@media (max-width: 480px) { | |||
.infobox { | |||
font-size: 12px; | |||
} | |||
.infobox th, | |||
.infobox td { | |||
padding: 0.3em 0.5em; | |||
} | |||
} | } | ||
2025年9月16日 (二) 02:10的版本
/* 这里放置的CSS将应用于所有皮肤 */
.infobox {
/* 移除默认边框间距 */
border-collapse: collapse;
max-width: 22em;
float: right;
clear: right;
table-layout: auto;
margin: 1rem 0;
}
.infobox th, .infobox td {
/* 添加边框使结构更清晰 */
border: 1px solid #ddd;
padding: 8px 12px;
text-align: left;
}
.infobox th {
/* 可以给th设置一个最小宽度作为保底 */
min-width: 70px;
background-color: #f5f5f5;
/* 防止内容换行,确保宽度由完整内容决定 */
white-space: nowrap;
}
.infobox caption {
font-weight: bold;
margin-bottom: 8px;
font-size: 1.2em;
}
/* 移动端适配 */
@media (max-width: 768px) {
.infobox {
max-width: 100%;
float: none;
margin: 1em auto;
font-size: 13px;
}
.infobox th,
.infobox td {
padding: 0.4em 0.6em;
display: block;
width: 100% !important;
box-sizing: border-box;
}
.infobox th {
background: #dde0e5;
border-bottom: none;
}
.infobox td {
border-top: none;
}
.infobox tr {
display: block;
margin-bottom: 0.5em;
}
}
/* 小屏幕手机适配 */
@media (max-width: 480px) {
.infobox {
font-size: 12px;
}
.infobox th,
.infobox td {
padding: 0.3em 0.5em;
}
}