注意:在保存之后,您可能需要清除浏览器缓存才能看到所作出的变更的影响。
?_=1
来访问最新页面。https://zh.moegirl.org.cn/User:Lingring/user_name.css?_=1
/* ================================ */
/* 样式: .nav-dh - TOP导航盒子样式 */
/* ================================ */
.nav-dh {
/* 设置盒子边框的颜色为蓝色,并定义边框宽度为2px */
border: 2px solid blue;
/* 设置盒子的圆角为5px,使盒子角部更平滑 */
border-radius: 5px;
/* 设置背景颜色为淡蓝色 (#87D9FF) */
background-color: #87D9FF;
/* 背景图像的大小自动填充盒子,保持比例 */
background-size: cover;
/* 设置盒子的宽度为500px */
width: 500px;
/* 设置盒子的左右外边距为自动,使其居中显示 */
margin: auto;
/* 文本居中显示 */
/* text-align: center; */
/* 设置盒子内容溢出隐藏,防止内容超出盒子外部 */
overflow: hidden;
/* 设置盒子为块级元素,使其可以设置宽度和高度 */
display: block;
/* 设置字体为黑体(sans-serif风格的中文字体) */
/* font-family: "黑体"; */
/* 设置字体为粗体 */
/* font-weight: bold; */
}
/* ================================ */
/* 样式: .nav-dh a:link, .nav-dh a:visited - 链接样式(未访问和已访问状态) */
/* ================================ */
.nav-dh a:link, .nav-dh a:visited {
/* 设置链接的背景色为深蓝色 (#568FDE) */
background-color: #568FDE;
/* 设置链接文本颜色为白色 */
color: white;
/* 设置链接的内边距为上下3px、左右6px,增加点击区域 */
padding: 3px 6px;
/* 设置文本居中显示 */
/* text-align: center; */
/* 去掉链接的默认下划线 */
text-decoration: none;
/* 设置为内联块级元素,使其可以设置宽高并且可以并排显示 */
display: inline-block;
}
/* ================================ */
/* 样式: .nav-dh a:hover, .nav-dh a:active - 链接样式(鼠标悬停和激活状态) */
/* ================================ */
.nav-dh a:hover, .nav-dh a:active {
/* 鼠标悬停和点击时背景色保持为深蓝色 (#568FDE) */
background-color: #568FDE;
/* 设置动画名称为gradChan(渐变变化) */
animation-name: gradChan;
/* 设置动画时长为0.5秒 */
animation-duration: 0.5s;
/* 设置动画结束后保持动画状态(维持背景色变化) */
animation-fill-mode: forwards;
}
/* ================================ */
/* 样式: .nav-dh-ct - 子元素的透明度样式 */
/* ================================ */
.nav-dh-ct {
/* 设置子元素的透明度 */
opacity: 1;
}
/* ================================ */
/* 样式: .nav-dh-ct > .reference a - 隐藏 .reference 元素中的链接 */
/* ================================ */
.nav-dh-ct > .reference a {
/* 隐藏 .reference 类中的所有链接 */
display: none;
}
/* ================================ */
/* 样式: .nav-dh > .mw-selflink - 自动链接样式(selflink) */
/* ================================ */
.nav-dh > .mw-selflink {
/* 设置背景色为中蓝色 (#3366CC) */
background-color: #3366CC;
/* 设置文本颜色为白色 */
color: white;
/* 设置链接的内边距为上下3px、左右6px */
padding: 3px 6px;
/* 设置文本居中显示 */
text-align: center;
/* 去掉链接的默认下划线 */
text-decoration: none;
/* 设置为内联块级元素,使其可以设置宽高并且可以并排显示 */
display: inline-block;
}
/* ================================ */
/* 样式: .nav-dh > .mw-selflink:hover - 鼠标悬停时自动链接的样式 */
/* ================================ */
.nav-dh > .mw-selflink:hover {
/* 鼠标悬停时背景色保持为中蓝色 (#3366CC) */
background-color: #3366CC;
/* 设置动画名称为gradChan-selfLink(自链接的渐变变化) */
animation-name: gradChan-selfLink;
/* 设置动画时长为0.5秒 */
animation-duration: 0.5s;
/* 设置动画结束后保持动画状态(维持背景色变化) */
animation-fill-mode: forwards;
}
/* ================================ */
/* 样式: .nav-dh-ct > .reference - 设置引用部分的背景色 */
/* ================================ */
.nav-dh-ct > .reference {
/* 设置引用部分的背景色为原始淡蓝色 (#87D9FF) */
background-color: #87D9FF;
}
/* ================================ */
/* 动画: gradChan - 链接背景色的渐变变化动画 */
/* ================================ */
@keyframes gradChan {
/* 动画从原始深蓝色 (#568FDE) 开始 */
from {background-color: #568FDE;}
/* 动画结束时,背景色变为更暗的蓝色 (#33579D) */
to {background-color: #33579D;}
}
/* ================================ */
/* 动画: gradChan-selfLink - 自链接背景色的渐变变化动画 */
/* ================================ */
@keyframes gradChan-selfLink {
/* 动画从中蓝色 (#3366CC) 开始 */
from {background-color: #3366CC;}
/* 动画结束时,背景色变为更暗的蓝色 (#33579D) */
to {background-color: #33579D;}
}