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,对所有用户加载。*/
/* 参考bwiki
/* 调整鼠标样式 */
html, body{
cursor: url("https://patchwiki.biligame.com/images/wukong/b/bb/sb51zsgl3cjtl7eapbp6f8q651rtyn0.png"),auto;
}
/* ==[[模板:黑幕]]== */
.heimu,.heimu a:link,.heimu a:visited,.heimu a.external:visited,.heimu rt{background-color:#000;color:#000}
.heimu:hover,.heimu:hover rt{-webkit-animation:heimugc 0.5s forwards;animation:heimugc 0.5s forwards;}
.heimu:hover a:link,.heimu:hover a:visited{-webkit-animation:heimulinkgc 0.5s forwards;animation:heimulinkgc 0.5s forwards;}
@-webkit-keyframes heimugc{to{color:#FFF}}
@keyframes heimugc{to{color:#FFF}}
@-webkit-keyframes heimulinkgc{to{color:#3B8BFF}}
@keyframes heimulinkgc{to{color:#3B8BFF}}
/* --[[模板:黑幕]]-- */
/* 赛季首页专用样式 v2.0 (2025-04-13) */
/* == 基础样式模块 == */
.season-block {
position: relative;
padding: 15px 20px 15px 35px;
margin-bottom: 25px;
border-radius: 4px;
background: rgba(255,255,255,0.95);
box-shadow: 0 2px 5px rgba(0,0,0,0.08);
transition: transform 0.2s ease;
overflow: hidden; /* 新增属性合并 */
will-change: transform; /* 预声明变化属性 */
}
.decorative-line {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 5px;
height: 90%;
border-radius: 2px;
transition: transform 0.4s ease, height 0.4s ease; /* 精准控制动画属性 */
background: linear-gradient(180deg,
transparent 0%,
currentColor 30%,
currentColor 70%,
transparent 100%
);
}
/* == 颜色系统定义 == */
.color-system-1 .decorative-line { --deco-color: #E67E22; }
.color-system-2 .decorative-line { --deco-color: #3498DB; }
.color-system-3 .decorative-line { --deco-color: #2ECC71; }
.color-system-4 .decorative-line { --deco-color: #9B59B6; }
/* == 动态效果模块 == */
/* 标题渐变与悬停 */
.season-block h3 {
margin: 0 0 12px 0;
padding-bottom: 8px;
border-bottom: 1px solid rgba(0,0,0,0.1);
background: linear-gradient(120deg, #2c3e50 30%, #3498db 70%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
transform-origin: left center;
}
.season-block:hover h3 {
transform: scale(1.05);
text-shadow: 0 2px 8px rgba(52,152,219,0.2);
}
/* 装饰线动画 */
.season-block:hover .decorative-line {
height: 100%;
opacity: 0.8;
animation: lineFlow 1.2s infinite linear;
}
@keyframes lineFlow {
0% { background-position: 0 0; }
100% { background-position: 0 200%; }
}
/* 悬浮光影效果 */
.season-block::after {
content: "";
position: absolute;
top: -50%;
left: -50%;
width: 200%;
height: 200%;
background: radial-gradient(circle at 50% 50%,
rgba(255,255,255,0.2) 0%,
rgba(255,255,255,0) 70%
);
transform: translate(var(--mouse-x), var(--mouse-y)) translateZ(0);
pointer-events: none;
opacity: 0;
transition: opacity 0.3s;
}
.season-block:hover::after {
opacity: 0.4;
}
/* 链接动态下划线 */
.season-nav a {
position: relative;
padding-bottom: 2px;
}
.season-nav a::after {
content: "";
position: absolute;
bottom: 0;
left: 50%;
width: 0;
height: 1px;
background: currentColor;
transition: all 0.3s;
}
.season-nav a:hover::after {
left: 0;
width: 100%;
}
/* == 性能优化模块 == */
@media (prefers-reduced-motion: reduce) {
* {
transition: none !important;
animation: none !important;
}
}
/* == 响应式适配 == */
@media (max-width: 768px) {
.season-block {
padding: 12px 15px;
margin-bottom: 20px;
}
.season-block h3 {
font-size: 1.2em;
}
}