/* ==================== 全局毛玻璃样式 ==================== */ /* 明亮模式 */ #body-wrap #recent-posts > .recent-post-item, #body-wrap .recent-post-item, #body-wrap #aside-content .card-widget, #body-wrap .layout > div:first-child:not(.recent-posts), #body-wrap #nav .menus_items .menus_item .menus_item_child, #body-wrap #pagination .page-number:not(.current), #body-wrap #pagination .extend, #page-header #post-info { background: rgba(255, 255, 255, 0.85); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); border: 1px solid rgba(255, 255, 255, 0.85); box-shadow: 0 8px 16px -4px rgba(138, 138, 138, 0.15); transition: background 0.3s ease, border 0.3s ease, box-shadow 0.3s ease; } #body-wrap #pagination .page-number:not(.current):hover, #body-wrap #pagination .extend:hover { background: #ff7142d2; border-color: #ff7142d2; color: #fff; } /* 夜间模式 */ html[data-theme="dark"] #body-wrap #recent-posts > .recent-post-item, html[data-theme="dark"] #body-wrap .recent-post-item, html[data-theme="dark"] #body-wrap #aside-content .card-widget, html[data-theme="dark"] #body-wrap .layout > div:first-child:not(.recent-posts), html[data-theme="dark"] #body-wrap #nav .menus_items .menus_item .menus_item_child, html[data-theme="dark"] #body-wrap #pagination .page-number:not(.current), html[data-theme="dark"] #body-wrap #pagination .extend, html[data-theme="dark"] #page-header #post-info { background: rgba(30, 30, 30, 0.6); border: 1px solid rgba(255, 255, 255, 0.08); box-shadow: 0 8px 16px -4px rgba(0, 0, 0, 0.2); } /* ==================== 页头与页脚透明 ==================== */ #footer, #page-header.post-bg, #page-header.page-bg { background: transparent !important; } #page-header.post-bg::before, #page-header.page-bg::before { background-color: transparent !important; } /* ==================== 文章卡片透明 ==================== */ #body-wrap #recent-posts > .recent-post-item .recent-post-info, #body-wrap #recent-posts > .recent-post-item .recent-post-info::before, #body-wrap #recent-posts > .recent-post-item .recent-post-info::after, #body-wrap #recent-posts > .recent-post-item .recent-post-info > .article-title, #body-wrap #recent-posts > .recent-post-item .recent-post-info > .article-meta-wrap, #body-wrap #recent-posts > .recent-post-item .recent-post-info > .content { background: transparent !important; background-color: transparent !important; box-shadow: none !important; } /* ==================== 表格样式 ==================== */ #article-container table:not(.gist table) { border-collapse: collapse; width: 100%; margin: 1.5rem 0; overflow-x: auto; } #article-container table:not(.gist table) thead { background: var(--btn-bg); color: var(--btn-color); } #article-container table:not(.gist table) th, #article-container table:not(.gist table) td { padding: 10px 16px; border: 1px solid var(--border-color); text-align: left; vertical-align: middle; } #article-container table:not(.gist table) tbody tr:nth-child(even) { background: rgba(0, 0, 0, 0.03); } html[data-theme="dark"] #article-container table:not(.gist table) tbody tr:nth-child(even) { background: rgba(255, 255, 255, 0.03); } /* ==================== 排版美化 ==================== */ #article-container p { line-height: 1.8; margin: 1rem 0; text-align: justify; } #article-container h1, #article-container h2, #article-container h3 { margin-top: 2rem; margin-bottom: 1rem; padding-bottom: 0.3rem; border-bottom: 2px solid var(--border-color); } /* ==================== 文章标题栏字体颜色(明亮模式) ==================== */ html:not([data-theme="dark"]) #post-info .post-title { color: #2c3e50 !important; text-shadow: none !important; } html:not([data-theme="dark"]) #post-info #post-meta, html:not([data-theme="dark"]) #post-info #post-meta a, html:not([data-theme="dark"]) #post-info #post-meta .post-meta-separator, html:not([data-theme="dark"]) #post-info #post-meta i { color: #2c3e50 !important; text-shadow: none !important; } /* ==================== 文章标题栏悬浮居中 ==================== */ #page-header #post-info { position: absolute; bottom: 0px; left: 50%; transform: translateX(-50%); margin: 0 auto; padding: 20px 40px; box-sizing: border-box; display: block; text-align: left; border-radius: 10px; width: min(92%, 1200px); } @media screen and (max-width: 768px) { #page-header #post-info { padding: 15px 20px !important; bottom: 20px !important; width: 90% !important; } #post-info #post-meta > .meta-firstline > span:not(.post-meta-wordcount), #post-info #post-meta > .meta-secondline > span:not(.post-meta-wordcount) { display: none !important; } #post-info #post-meta > .meta-firstline > .post-meta-separator, #post-info #post-meta > .meta-secondline > .post-meta-separator { display: none !important; } #post-info .post-title { text-align: justify !important; text-align-last: left !important; display: block; margin-bottom: 10px; } } /* ==================== 文章标题栏字号放大 30% ==================== */ #post-info .post-title { font-size: 3.25em !important; } @media screen and (max-width: 768px) { #post-info .post-title { font-size: 2.73em !important; } } /* ==================== 背景轮换淡入时长(配合 3 秒切换) ==================== */ #web_bg.bg-animation { animation-duration: 1.2s; } /* ==================== 全站字体:霞鹜文楷 (LXGW WenKai) ==================== */ /* 仅替换正文字体,代码块保持主题自带的等宽字体 */ body, #body-wrap, #article-container, #post-info, #aside-content, #nav, .site-page, footer#footer, #pagination { font-family: "LXGW WenKai", "LXGW WenKai Screen", "Microsoft YaHei", "PingFang SC", sans-serif !important; }