因为我是做Web开发的,就稍微改了一点点
我个人的想法有限,如果你们还有什么好的修改想法可以评论区跟我讲,我再调试出新版
对了,我个人喜欢用黑色风格,所以我只修改了暗黑风格下的样式,需要切换暗黑风格才会生效
/* 背景图片 url可自行替换修改 */
.theme-dark .page {
background-image: url(https://b2.kuibu.net/file/imgdisk/2023/07/06/silhouette_night_starry_sky_137292_2560x1440.jpg);
background-position: center;
background-size: cover;
}
/* 主体块div调整半透明色 */
.theme-dark .navbar, .theme-dark .alert:not(.alert-important), .theme-dark .card, .theme-dark .card-footer, .theme-dark .card-stacked::after, .theme-dark .dropdown-menu, .theme-dark .footer:not(.footer-transparent), .theme-dark .modal-content, .theme-dark .modal-header, .theme-dark .toast, .theme-dark .toast-header {
background-color: rgba(29, 39, 59, 0.8)!important;
}
/* 输入框等小组件div半透明色 */
.theme-dark .form-check-input:not(:checked), .theme-dark .form-control, .theme-dark .form-file-text, .theme-dark .form-select, .theme-dark .form-selectgroup-check {
background-color: rgba(29, 39, 59, 0.4);
}
/* 主体页弹性填充,防止超出页面范围,导致背景复制 */
.theme-dark .page #page_content {
flex: 1 1 0;
overflow-y: auto;
}
if(window.hljsLoader && !document.currentScr(๐•ᴗ•๐).parentNode.hasAttribute('data-s9e-livepreview-onupdate')) {
window.hljsLoader.highlightBlocks(document.currentScr(๐•ᴗ•๐).parentNode);
}
使用方法:(๐•ᴗ•๐)s-设置-基础设置-自定义 CSS/JavaScr(๐•ᴗ•๐) 把上面的代码粘贴进CSS的输入框里,保存后切换至暗黑模式即可生效
2023.12.14 感谢 @NikoCatOoO 背景未固定填充页面Bug(已修复)