MediaWiki:Common.css
跳转到导航
跳转到搜索
注意:在发布之后,您可能需要清除浏览器缓存才能看到所作出的变更的影响。
- Firefox或Safari:按住Shift的同时单击刷新,或按Ctrl-F5或Ctrl-R(Mac为⌘-R)
- Google Chrome:按Ctrl-Shift-R(Mac为⌘-Shift-R)
- Internet Explorer或Edge:按住Ctrl的同时单击刷新,或按Ctrl-F5
- Opera:按 Ctrl-F5。
/* ===== 侧边栏美化 ===== */
/* 侧边栏整体容器 */
#mw-panel {
font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
}
/* 侧边栏标题(导航、工具等) */
#mw-panel .portal h3 {
font-size: 14px;
font-weight: 600;
color: #2c3e50;
letter-spacing: 0.5px;
padding: 8px 0 6px 0;
border-bottom: 2px solid #e8ecf1;
margin-bottom: 4px;
text-transform: uppercase;
font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
}
/* 侧边栏链接列表 */
#mw-panel .portal .body {
padding: 4px 0 0 0;
}
/* 侧边栏链接项 */
#mw-panel .portal .body ul li {
list-style: none;
padding: 3px 0;
margin: 0;
}
/* 侧边栏链接 - 基础样式 + Hover效果 */
#mw-panel .portal .body ul li a {
display: block;
padding: 6px 10px 6px 8px;
font-size: 13px;
font-weight: 400;
color: #4a5568;
text-decoration: none;
border-radius: 6px;
transition: all 0.25s ease-in-out;
font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
position: relative;
}
/* Hover效果 - 主要 */
#mw-panel .portal .body ul li a:hover {
color: #1a56db;
background-color: #ebf4ff;
padding-left: 16px;
transform: translateX(2px);
}
/* Hover效果 - 右侧指示条 */
#mw-panel .portal .body ul li a::before {
content: '';
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 3px;
height: 0;
background: #1a56db;
border-radius: 0 3px 3px 0;
transition: height 0.25s ease;
}
#mw-panel .portal .body ul li a:hover::before {
height: 70%;
}
/* 选中/当前页面链接 */
#mw-panel .portal .body ul li a:active,
#mw-panel .portal .body ul li a:focus {
color: #1a56db;
background-color: #dbeafe;
}
/* 侧边栏分隔线美化 */
#mw-panel .portal {
border-bottom: 1px solid #f0f2f5;
padding-bottom: 4px;
}
/* 最后一个portal去掉边框 */
#mw-panel .portal:last-child {
border-bottom: none;
}
/* ===== 移动端兼容 ===== */
@media screen and (max-width: 750px) {
#mw-panel .portal .body ul li a {
font-size: 14px;
padding: 8px 12px;
}
#mw-panel .portal .body ul li a:hover {
padding-left: 18px;
}
}