分享一下我洛谷的stylus样式

416 字
2 分钟
分享一下我洛谷的stylus样式

效果如封面图所示

首先你需要在你的浏览器中安装一个名叫stylus的拓展

在拓展中为luogu.com.cn新建一个样式,并填入以下代码:

.l-card[data-v-176b97b3]{
background-color:#ffffff80 !important;
}
.theme-page{
background:url("https://static.kivo.wiki/images/gallery/4.%E5%AE%98%E6%96%B9-%E5%A3%81%E7%BA%B8&%E8%B4%BA%E5%9B%BE/%E4%BC%8A%E5%90%95%E6%B3%A23840x2390.png") no-repeat center top fixed!important;
background-size:cover !important;
--theme-body-image:url() !important;
--theme-body-color:linear-gradient(#0000, #0000) !important;
}
.lfe-code{
background-color:#ffffff80 !important;
}
.lfe-body{
background:url("https://static.kivo.wiki/images/gallery/4.%E5%AE%98%E6%96%B9-%E5%A3%81%E7%BA%B8&%E8%B4%BA%E5%9B%BE/%E4%BC%8A%E5%90%95%E6%B3%A23840x2390.png") no-repeat center top fixed!important;
background-size:cover !important;
}
.lcolor-bg-background{
background:url("https://static.kivo.wiki/images/gallery/4.%E5%AE%98%E6%96%B9-%E5%A3%81%E7%BA%B8&%E8%B4%BA%E5%9B%BE/%E4%BC%8A%E5%90%95%E6%B3%A23840x2390.png") no-repeat center top fixed!important;
background-size:cover !important;
}
.user-header-bottom[data-v-3c374c4c]{
background-color:#ffffff80 !important;
}
.inner-card[data-v-31f53410]{
background-color:#ffffff80 !important;
}
.card[data-v-f9624136]{
background-color:#ffffff80 !important;
}
.frame[data-v-66fcc50b]{
background-color:#ffffff80 !important;
}
.lfe-body{
background:url("https://static.kivo.wiki/images/gallery/4.%E5%AE%98%E6%96%B9-%E5%A3%81%E7%BA%B8&%E8%B4%BA%E5%9B%BE/%E4%BC%8A%E5%90%95%E6%B3%A23840x2390.png") no-repeat center top fixed!important;
background-size:cover !important;
}
.ide-container[data-v-18f41aad]{
background-color:#0000 !important;
}
.ide-toolbar{
background-color:#ffffff80 !important;
}
.layout-horizontal > .panel-divider[data-v-40e5a07c]{
background-color:#0000 !important;
}
.ͼ2 .cm-gutters{
background-color:#ffffff80 !important;
}
.combo-wrapper > .text[data-v-dbc33c63]{
background-color:#ffffff80 !important;
}
.am-comment-bd{
background-color:#ffffff80 !important;
}
.am-comment-hd{
background-color:#ffffff80 !important;
}
.am-panel{
background-color:#0000 !important;
}
.header-layout.tiny[data-v-7ddab1d5]{
background:url("https://cdn.luogu.com.cn/upload/image_hosting/rl7ih3g3.png") no-repeat center top fixed!important;
background-size:cover !important;
}
.problem{
background-color: rgba(255,255,255,0.4);
}
.cm-content{
font-family:JetBrainsMono Nerd Font Mono !important;
}
.lfe-marked{
font-family:JetBrainsMono Nerd Font Mono !important;
}
.title{
font-family:JetBrainsMono Nerd Font Mono !important;
}
.lfe-h2{
font-family:JetBrainsMono Nerd Font Mono !important;
}
h3{
font-family:JetBrainsMono Nerd Font Mono !important;
}
.bottom-wrap{
background-color:#ffffff80 !important;
}
.CodeMirror-code{
background-color:#fff0 !important;
font-family:JetBrainsMono Nerd Font Mono !important;
}
.mp-preview-area{
background-color:#fff0 !important;
}
.CodeMirror-gutters{
background-color:#fff0 !important;
font-family:JetBrainsMono Nerd Font Mono !important;
}
.CodeMirror{
background-color:#fff0 !important;
font-family:JetBrainsMono Nerd Font Mono !important;
}
.mp-editor-toolbar[data-v-a97ae32a]{
background-color:#ffffff80 !important;
}
.marked[data-v-e5ad98f0] code, .marked[data-v-e5ad98f0] pre{
background-color:rgba(255, 255, 255, .4) !important;
}
.language-cpp{
font-family:JetBrainsMono Nerd Font Mono !important;
}
pre[data-v-1124744c]{
background-color:rgba(255, 255, 255, .4) !important;
font-family:JetBrainsMono Nerd Font Mono !important;
}
.am-slider-default{
background-color:rgba(0,0,0,0)!important;
box-shadow: 0 0 0px rgba(0,0,0,0)!important;
}
.cm-editor {
position: relative !important;
background: url("https://bucket.img.catcdn.cn/home/Suzumi_home_Idle_01_0.9414999999999997_waifu2x_2x_3n_png.webp") !important;
background-size: auto 100% !important;
background-position: center !important;
background-repeat: no-repeat !important;
background-attachment: scroll !important;
}
.cm-content {
position: relative !important;
z-index: 10 !important;
background: transparent !important;
min-height: 100vh !important;
}
.cm-content::before {
content: '' !important;
position: absolute !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
background-color: rgba(255, 255, 255, .4) !important;
pointer-events: none !important;
z-index: -1 !important;
}
.cm-line {
position: relative !important;
z-index: 1 !important;
}

如果板块没有变成半透明,请在洛谷把毛玻璃效果关掉,每部分的背景图和参数可自行替换

关于css语言的语法,请自行学习,这里不再赘述其实就是懒

支持与分享

如果这篇文章对你有帮助,欢迎分享给更多人或打赏支持!

打赏
分享一下我洛谷的stylus样式
https://azx.xn--0iv.gay/posts/luogustylus/
作者
WanFoxAZX
发布于
2026-07-17
许可协议
CC BY-NC-SA 4.0

评论区

Profile Image of the Author
WanFoxAZX
Hello, I'm AZX.
公告
Welcome!
分类
标签
最新动态

还没有发布动态

更多动态
站点统计
文章
10
动态
0
分类
6
标签
5
总字数
2,549
运行时长
0
最后活动
0 天前
站点信息
构建平台
Netlify CI
博客版本
Firefly v6.15.5
文章许可
CC BY-NC-SA 4.0

当前页面没有目录