CSDN简化,清理额外元素,暗黑模式兼容
CSDN CSS by XiaoWoHan

Details
AuthorXiaoWoHan
LicenseNo License
Categoryblog.csdn.net
Created
Updated
Code size7.3 kB
Code checksum9e3a4578
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
沉浸式阅读CSDN博客
- 清理干扰元素
- 支持暗黑模式
- 开放复制选择,需搭配
Simple Allow Copy
插件使用
Source code
/* ==UserStyle==
@name CSDN CSS
@version 20250320.03.03
@namespace https://userstyles.world/user/CrayonLSnail
@description CSDN简化,清理额外元素,暗黑模式兼容
@author CrayonLSnail
@license No License
==/UserStyle== */
@-moz-document domain("csdn.net") {
/** 精简当前样式 **/
html,
body{
background-image: none !important;
background-size: auto !important;
font-family: source-han-serif-tc, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
min-width: unset !important;
min-height: unset !important;
margin: 0 !important;
padding: 0 !important;
}
main,
.main,
#app {
float: inherit;
margin: 40px auto;
}
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
a,
abbr,
body,
cite,
dd,
dl,
dt,
h1,
h2,
h3,
h4,
h5,
h6,
iframe,
input,
li,
object,
ol,
p,
span,
ul {
font-family: source-han-serif-tc, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif!important;
}
code,
code span,
pre,
pre span {
font-family: "Source Code Pro", Monaco, Menlo, Consolas, monospace!important;
}
h1 {
font-size: 20px!important;
}
h2 {
font-size: 18px!important;
}
h3,
h4,
h5,
h6 {
font-size: 18px!important;
}
.main_father {
border-radius: 10px!important;
width: 70%;
position: relative;
left: 16%;
}
#mainBox,
.article-box {
margin-left: auto;
margin-right: auto;
}
#article_content,
#pf1,
.bg-white {
border: none !important;
width: 100% !important;
height: auto !important;
overflow: auto !important;
}
.set-code-hide {
height: unset !important;
overflow-y: unset !important;
}
.recommend-item-box {
width: 50%;
max-width: 25rem;
}
.recommend-item-box .content,
.recommend-item-box h4 {
width: 100%!important;
}
main div.blog-content-box,
.content-view{
border-radius: 10px!important;
background-image: none!important;
background-color: #ffffff !important;
color: #222226 !important;
padding:80px;
}
#content_views a,
.follow-nickName {
color: #42b983!important;
}
code {
color: #e96900!important;
}
.markdown_views blockquote p {
color: #6e6e6e!important;
}
blockquote {
border-left: 6px solid #42b983!important;
}
div.article-title-box > h1 {
font-size: 32px!important;
}
.csdn-side-toolbar {
margin: 40px!important;
}
.imgViewDom {
background-color: rgba(0, 0, 0, 0)!important;
}
.pre-numbering {
font-size: 12px!important;
}
img {
border-radius: 10px!important;
}
.detail-container {
position: relative!important;
left: 15%!important;
}
.ask-issue-content,
.article-box .cont{
max-height: unset!important;
}
.detail_container{
position: relative!important;
left:10%!important;
}
}
@-moz-document domain("csdn.net") {
/** 颜色模式 **/
/** 深色模式 **/
@media (prefers-color-scheme: dark) {
:root {
--background: #292c2d;
--content-background: #222425;
--code-background: #26292a;
--border-panel-background: #2B2B2B;
--content-text: rgb(239, 234, 226);
}
html,
body,
.page-container,
#chatgpt-article-detail,
table,
tbody,
tr,
td {
background-color: var(--background) !important;
}
.main,
main div.blog-content-box,
.article-header-box,
.title-article,
.content-view,
.markdown_views,
.bg-white,
#detail,
.el-card,
.csdn-tree,
.bottom_hover,
.el-card__body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
span,
table tr td,
ol li,
.ai-abstract,
.abstract-content,
#userSkin {
background-color: var(--content-background) !important;
background-image: none !important;
color: var(--content-text) !important;
}
pre,
.prettyprint,
.pre-numbering,
code {
background-color: var(--code-background) !important;
color: var(--content-text) !important;
}
.imgViewDom .swiper,
.bg_sql {
background: var(--border-panel-background) !important;
}
table tr th {
background-color: var(--border-panel-background) !important;
color: var(--content-text) !important;
}
}
/** 浅色模式 **/
@media (prefers-color-scheme: light) {
:root {
--background: #FAFAFA;
--content-background: #FFFFFF;
--code-background: #F8F8F8;
--border-panel-background: #2B2B2B;
--content-text: #222226;
}
body,
#userSkin {
background-color: var(--background) !important;
background-image: none !important;
}
pre,
.prettyprint,
.pre-numbering,
code {
background-color: var(--code-background) !important;
}
.imgViewDom .swiper {
background: var(--content-background) !important;
}
.article-header-box {
background-color: var(--content-background) !important;
background-image: none !important;
color: var(--content-text) !important;
}
main div.blog-content-box,
.content-view {
background-color: var(--content-background) !important;
color: var(--content-text) !important;
}
}
}
@-moz-document domain("csdn.net") {
/** 解除Code禁止选中 **/
#content_views pre,
#content_views pre code,
.forbid{
-webkit-touch-callout: text !important;
-webkit-user-select: text !important;
-khtml-user-select: text !important;
-moz-user-select: text !important;
-ms-user-select: text !important;
user-select: text !important;
}
}
@-moz-document domain("csdn.net") {
/** 清理无用元素 **/
#content_views pre .signin,
#csdn-toolbar,
.csdn-side-toolbar,
#blogColumnPayAdvert,
.passport-login-container,
.article-info-box,
.blog_container_aside,
.recommend-box,
#pcCommentBox,
#recommendNps,
.template-box,
.more-toolbox-new,
.blog-footer-bottom,
#toolBarBox,
aside,
.signin,
.hide-article-box,
.con-r-tag,
#csdn-toolbar,
#rightAside,
.operating,
.c-gray,
.un-collection,
.read-count,
.article-read-img,
.article-type-img,
.hide-article-box,
.blog-expert-recommend-box,
.recommend-item-box.type_hot_word,
.recommend-ad-box,
.isGreatIcon,
.tool-box,
.meau-gotop-box,
.recommend-end-box,
.login-mark,
.blog_title_box.oneline,
.recommend-item-box::before,
.pulllog-box,
#mainBox > aside,
.more-toolbox,
.right-message,
.main-login,
.identity-icon,
.show-txt,
.title .flag,
#passportbox,
.column-advert-box,
.article-plan-img,
.article-plan-text,
.up-time,
.article-vip-img,
.article-vip-text,
.hide-preCode-box,
a[data-type='cs'],
a[data-type='report'],
a[data-type='app'],
.passport-login-tip-container,
#treeSkill,
#blogHuaweiyunAdvert,
.bg_sql .bar,
.top-bar,
.box-wrap,
#copyright-box,
#content_bottom_fix_nav,
.open,
.relative,
.layout-right,
#page_bottom_fix_nav,
.space,
#recommend,
.nav-bottom-wrap,
.ccloud-tool-bar,
.cloud-breadcrumb,
.user-right-floor,
.recommendList,
.upDownPage,
.commentToolbar,
.rates-outer,
.ai-assistant-entrance,
.detail_right,
.question_operation_container,
.expandBtn,
.ask-questions-list,
.recommend-ask-box,
.ask_breadcrumb_box,
.reply_content_tool,
.user-profile-head-banner,
.blogStar-box,
.write-activity-box,
.vip{
display: none !important;
}
}