MediaWiki:Common.css：修订间差异
MediaWiki界面页面
更多操作
无编辑摘要 |
无编辑摘要 |
||
| 第19行： | 第19行： | ||
} | } | ||
/* | /* 现代渐变横幅样式 */ | ||
.hp-banner { | .hp-banner { | ||
display: flex !important; | display: flex !important; | ||
justify-content: space-between; | justify-content: space-between; | ||
align-items: center; | align-items: center; | ||
/* 渐变背景：使用深蓝色调，呼应学术感 */ | |||
background: linear-gradient(135deg, #1a3a6c 0%, #2a5298 100%) !important; | |||
padding: | color: white !important; /* 强制文字白色 */ | ||
margin: 10px 0 | padding: 35px 45px !important; | ||
border-radius: | margin: 10px 0 30px 0 !important; | ||
box-shadow: 0 | border-radius: 12px !important; /* 更圆润的角 */ | ||
border: none !important; | |||
box-shadow: 0 8px 20px rgba(26, 58, 108, 0.2) !important; | |||
position: relative; | |||
overflow: hidden; | |||
} | |||
/* 装饰性光晕效果 */ | |||
.hp-banner::after { | |||
content: ""; | |||
position: absolute; | |||
top: -50%; | |||
right: -10%; | |||
width: 300px; | |||
height: 300px; | |||
background: rgba(255, 255, 255, 0.05); | |||
border-radius: 50%; | |||
pointer-events: none; | |||
} | } | ||
.hp-banner-info { | .hp-banner-info { | ||
flex: 2; | flex: 2; | ||
z-index: 1; /* 确保文字在光晕上方 */ | |||
} | } | ||
.hp-banner-title { | .hp-banner-title { | ||
font-size: 2. | font-size: 2.5em !important; | ||
font-family: "Linux Libertine", "Georgia", "Times", serif; | font-family: "Linux Libertine", "Georgia", "Times", serif; | ||
font-weight: | font-weight: bold !important; | ||
color: # | color: #ffffff !important; | ||
margin: 0 0 | margin: 0 0 10px 0 !important; | ||
border: none !important; | text-shadow: 0 2px 4px rgba(0,0,0,0.3); | ||
border: none !important; | |||
} | } | ||
.hp-banner-subtitle { | .hp-banner-subtitle { | ||
font-size: 1. | font-size: 1.2em !important; | ||
color: | color: rgba(255, 255, 255, 0.9) !important; | ||
margin-bottom: | margin-bottom: 12px !important; | ||
font-weight: 300; | |||
} | } | ||
.hp-banner-stats { | .hp-banner-stats { | ||
font-size: 0. | font-size: 0.95em !important; | ||
color: | background: rgba(0, 0, 0, 0.2); | ||
display: inline-block; | |||
padding: 4px 12px; | |||
border-radius: 20px; | |||
color: rgba(255, 255, 255, 0.8) !important; | |||
} | } | ||
| 第59行： | 第83行： | ||
flex: 1; | flex: 1; | ||
text-align: right; | text-align: right; | ||
border-left: 1px solid | border-left: 1px solid rgba(255, 255, 255, 0.2) !important; | ||
padding-left: | padding-left: 30px; | ||
line-height: 1. | line-height: 2; | ||
z-index: 1; | |||
} | |||
/* 调整 Banner 内部链接颜色 */ | |||
.hp-banner-nav a { | |||
color: #ffd700 !important; /* 金黄色链接，突出重点 */ | |||
font-weight: bold; | |||
text-decoration: none !important; | |||
} | |||
.hp-banner-nav a:hover { | |||
color: #ffffff !important; | |||
text-decoration: underline !important; | |||
} | } | ||
/* | /* 手机端适配 */ | ||
@media (max-width: 850px) { | @media (max-width: 850px) { | ||
.hp-banner { | .hp-banner { | ||
padding: 30px 20px !important; | |||
flex-direction: column; | flex-direction: column; | ||
text-align: center; | text-align: center; | ||
} | } | ||
.hp-banner-nav { | .hp-banner-nav { | ||
border-left: none; | border-left: none !important; | ||
border-top: 1px solid | border-top: 1px solid rgba(255, 255, 255, 0.2) !important; | ||
margin-top: | margin-top: 20px; | ||
padding: | padding: 20px 0 0 0 !important; | ||
text-align: center; | text-align: center; | ||
width: 100%; | width: 100%; | ||
} | } | ||
} | } | ||