mirror of
https://github.com/Wcowin/Mkdocs-Wcowin.git
synced 2025-07-20 00:46:34 +00:00
Deployed addfa12 with MkDocs version: 1.6.1
This commit is contained in:
parent
596e949176
commit
ec096c2877
513
ZH-TW/index.html
513
ZH-TW/index.html
@ -2856,47 +2856,68 @@ t.parentNode.insertBefore(e,t)}})();
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2956,7 +2977,427 @@ t.parentNode.insertBefore(e,t)}})();
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -3093,104 +3093,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../link/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 友链"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
友链
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../resume/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 个人简历"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
个人简历
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../../link/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 友链"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">友链</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../resume/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 个人简历"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">个人简历</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3250,7 +3254,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2674,104 +2674,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
hidden
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../geren/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 作者个人简介"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
作者个人简介
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../zcw/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 支持作者"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
支持作者
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
hidden
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../geren/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 作者个人简介"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">作者个人简介</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../zcw/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 支持作者"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">支持作者</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2831,7 +2835,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -3839,82 +3839,94 @@ purus auctor massa, nec semper lorem quam in massa.</p>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../zcw/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 支持作者"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
支持作者
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../zcw/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 支持作者"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">支持作者</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3974,7 +3986,427 @@ purus auctor massa, nec semper lorem quam in massa.</p>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2904,102 +2904,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../resume/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 个人简历"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
个人简历
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../test/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 功能测试"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
功能测试
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../resume/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 个人简历"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">个人简历</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../test/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 功能测试"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">功能测试</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3059,7 +3065,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2796,83 +2796,94 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../../../2022/06/06/2022%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2022网站更新记录"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2022网站更新记录
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../../../../2022/06/06/2022%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2022网站更新记录"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">2022网站更新记录</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2932,7 +2943,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2574,6 +2574,10 @@
|
||||
|
||||
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>2022年网站建设经历了三个阶段：6月确定MKdocs框架并测试早期功能；10月全款购入独立域名并取消cookie确认以优化隐私保护；同月建立Github仓库正式上线，移除cookie弹窗简化访问流程，并新增首页反馈功能。更新重点包括技术框架选型、用户隐私优化及交互体验改进。</p>
|
||||
</div>
|
||||
<h2 id="2022-10-20"></p><h1 id="01" name="01"><strong>2022-10-20</strong></h1><p><a class="headerlink" href="#2022-10-20" title="Permanent link">¶</a></h2>
|
||||
<ul>
|
||||
<li>建立Github仓库，正式建站</li>
|
||||
@ -2850,104 +2854,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../../../2021/12/18/%E5%8D%9A%E5%AE%A2%E6%96%87%E7%AB%A0%E6%B5%8B%E8%AF%95/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 博客文章测试"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
博客文章测试
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../../../2023/12/21/2023%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2023网站更新记录"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2023网站更新记录
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../../../../2021/12/18/%E5%8D%9A%E5%AE%A2%E6%96%87%E7%AB%A0%E6%B5%8B%E8%AF%95/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 博客文章测试"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">博客文章测试</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../../../../2023/12/21/2023%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2023网站更新记录"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">2023网站更新记录</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3007,7 +3015,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2664,6 +2664,10 @@
|
||||
|
||||
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文记录了2023年网站的技术更新历程，主要包括：引入AI问答机器人（每月25条限制）、新增多语言支持（含台湾地区）、建立Mkdocs-Wcowin主题、优化移动端适配和页面加载速度。关键改进涉及Latex渲染修复、图片懒加载、友链/博客功能新增，以及持续的性能优化（标注为"玄学"）。技术亮点包括giscus评论系统集成、文楷字体应用和国内镜像部署，整体提升了用户体验和功能完整性。</p>
|
||||
</div>
|
||||
<h2 id="2023-12-21"></p><h1 id="01" name="01"><strong>2023-12-21</strong></h1><p><a class="headerlink" href="#2023-12-21" title="Permanent link">¶</a></h2>
|
||||
<ul>
|
||||
<li>优化网站流畅度（玄学）</li>
|
||||
@ -3033,104 +3037,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../../../2022/06/06/2022%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2022网站更新记录"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2022网站更新记录
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../../../2024/01/01/2024%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2024网站更新记录"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2024网站更新记录
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../../../../2022/06/06/2022%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2022网站更新记录"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">2022网站更新记录</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../../../../2024/01/01/2024%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2024网站更新记录"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">2024网站更新记录</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3190,7 +3198,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2754,6 +2754,10 @@
|
||||
|
||||
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>2024年网站持续优化，重点提升流畅度和访问速度，包括启用CDN加速、删除冗余代码、优化UI显示效果。技术改进涉及MKdocs主题更新、代码显示优化、图片迁移至SMMS平台，并引入自动新标签页打开功能。网站被百度/谷歌收录，友链扩展至16位，同时完善了文档修改时间记录功能。</p>
|
||||
</div>
|
||||
<h2 id="2024-12-24"></p><h1 id="01" name="01"><strong>2024-12-24</strong></h1><p><a class="headerlink" href="#2024-12-24" title="Permanent link">¶</a></h2>
|
||||
<ul>
|
||||
<li>优化网站流畅度（玄学）</li>
|
||||
@ -3251,104 +3255,108 @@ Look at this source <a href="https://github.com/JakubAndrysek/mkdocs-open-in-new
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../../../2023/12/21/2023%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2023网站更新记录"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2023网站更新记录
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../../../2025/01/01/2025%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2025网站更新记录"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2025网站更新记录
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../../../../2023/12/21/2023%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2023网站更新记录"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">2023网站更新记录</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../../../../2025/01/01/2025%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2025网站更新记录"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">2025网站更新记录</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3408,7 +3416,427 @@ Look at this source <a href="https://github.com/JakubAndrysek/mkdocs-open-in-new
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2689,6 +2689,10 @@
|
||||
|
||||
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>该网站2025年持续优化性能与用户体验，重点提升页面流畅度和加载速度，修复了友链统计、评论区定位等多项功能问题。设计方面引入Material Design圆角化风格，重构页脚样式，并更新教程内容适配最新版本。同时优化了图片查看功能，清理失效链接，改进留言板交互设计，确保网站稳定运行与视觉一致性。</p>
|
||||
</div>
|
||||
<h2 id="2025-07-08"></p><h1 id="01" name="01"><strong>2025-07-08</strong></h1><p><a class="headerlink" href="#2025-07-08" title="Permanent link">¶</a></h2>
|
||||
<ul>
|
||||
<li>优化网站流畅度（玄学）</li>
|
||||
@ -3036,84 +3040,94 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../../../2024/01/01/2024%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2024网站更新记录"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2024网站更新记录
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../../../../2024/01/01/2024%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2024网站更新记录"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">2024网站更新记录</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3173,7 +3187,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2458,6 +2458,10 @@
|
||||
|
||||
<h1>许可声明</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>MIT许可证授予用户自由使用、修改和分发软件的广泛权利，仅要求保留版权声明和许可条款。该许可明确声明软件按"原样"提供，不承担任何质量担保或法律责任，适用于希望最大限度开放代码使用的开发者。作为最流行的开源许可之一，其简洁性和宽松性使其成为商业和开源项目的理想选择。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>252</strong></p>
|
||||
@ -2737,83 +2741,94 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
hidden
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../Mkdocs/mkfirst/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 0.Mkdocs教程前言"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
0.Mkdocs教程前言
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
hidden
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../Mkdocs/mkfirst/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 0.Mkdocs教程前言"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">0.Mkdocs教程前言</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2873,7 +2888,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2549,6 +2549,10 @@
|
||||
|
||||
<h1>如何给MKdocs添加友链</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文介绍了在MKdocs中添加友链的具体方法，通过CSS样式代码实现网格化友链展示效果。关键步骤包括复制代码到.md文件、自定义卡片样式（悬停动画、圆角设计）以及响应式布局适配。技术亮点涵盖网格布局、过渡动画和移动端优化，适用于技术博客等需要展示外部链接的场景。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>92</strong> | 有效代码行数：<strong>140</strong></p>
|
||||
@ -3181,104 +3185,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../mkdocsblog/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 添加Mkdocs博客"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
添加Mkdocs博客
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../websitebeauty/yuanjiaohua/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 网页圆角化设计"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
网页圆角化设计
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../mkdocsblog/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 添加Mkdocs博客"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">添加Mkdocs博客</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../../websitebeauty/yuanjiaohua/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 网页圆角化设计"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">网页圆角化设计</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3338,7 +3346,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2579,6 +2579,10 @@
|
||||
|
||||
<h1>1.利用Mkdocs部署静态网页</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文介绍了使用MkDocs框架部署静态网页到GitHub Pages的完整流程。详细说明了从创建GitHub仓库、本地环境配置、MkDocs初始化到最终部署的关键步骤，包括目录结构调整、workflow配置和yml文件基础设置。重点强调了GitHub Actions的权限设置和Pages服务的发布路径选择，为技术人员提供了快速搭建文档网站的实践指南。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>485</strong> | 有效代码行数：<strong>75</strong></p>
|
||||
@ -3091,102 +3095,108 @@ MkDocs中文文档: <a href="https://hellowac.github.io/mkdocs-docs-zh/">MkDocs
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../mkfirst/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 0.Mkdocs教程前言"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
0.Mkdocs教程前言
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../mkdocs2/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2.Mkdocs配置说明(mkdocs.yml)"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2.Mkdocs配置说明(mkdocs.yml)
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../mkfirst/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 0.Mkdocs教程前言"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">0.Mkdocs教程前言</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../mkdocs2/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2.Mkdocs配置说明(mkdocs.yml)"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">2.Mkdocs配置说明(mkdocs.yml)</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3246,7 +3256,427 @@ MkDocs中文文档: <a href="https://hellowac.github.io/mkdocs-docs-zh/">MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2861,6 +2861,10 @@
|
||||
|
||||
<h1>2.Mkdocs配置说明(mkdocs.yml)</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文详细介绍了Mkdocs配置文件mkdocs.yml的核心配置项，包括站点基本信息设置、主题配色方案（支持明暗模式切换）、导航功能优化（如目录展开、返回顶部等）、搜索增强特性以及Markdown扩展支持。重点讲解了标签系统实现方法、自定义CSS/JS的引入方式，并提供了UI美化建议。该配置文件通过模块化设计实现了文档站点的个性化定制，特别适合需要灵活控制界面和功能的文档项目。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>2</strong> 分钟 | 中文字符：<strong>818</strong> | 有效代码行数：<strong>555</strong></p>
|
||||
@ -4358,102 +4362,108 @@ javascripts/mathjax.js里有对数学公式的扩展 </p>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../mkdocs1/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 1.利用Mkdocs部署静态网页"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
1.利用Mkdocs部署静态网页
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../mkdocs3/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 3.解决Github Pages部署mkdocs自定义域名失效的问题"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
3.解决Github Pages部署mkdocs自定义域名失效的问题
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../mkdocs1/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 1.利用Mkdocs部署静态网页"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">1.利用Mkdocs部署静态网页</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../mkdocs3/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 3.解决Github Pages部署mkdocs自定义域名失效的问题"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">3.解决Github Pages部署mkdocs自定义域名失效的问题</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -4513,7 +4523,427 @@ javascripts/mathjax.js里有对数学公式的扩展 </p>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2464,6 +2464,10 @@
|
||||
|
||||
<h1>3.解决Github Pages部署mkdocs自定义域名失效的问题</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>在Github Pages部署mkdocs时，自定义域名失效的原因是项目未拉取到本地，导致每次推送后CNAME文件被清除。解决方法是在/docs目录下创建无后缀的CNAME文件并填入域名，确保配置持久化。该方案适用于使用mkdocs构建文档并需绑定自定义域名的场景。</p>
|
||||
</div>
|
||||
<p>在/docs目录下创建一个 CNAME 的 无后缀 文件，然后在里面填入你的域名<br />
|
||||
<img alt="" src="https://s1.imagehub.cc/images/2024/02/02/d23082e5d3ebb839dba8b589a1cb5b7c.png" /></p>
|
||||
<div class="admonition tip">
|
||||
@ -2726,102 +2730,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../mkdocs2/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2.Mkdocs配置说明(mkdocs.yml)"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2.Mkdocs配置说明(mkdocs.yml)
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../websitebeauty/Mkdocs-AI-Summary/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: MkDocs文档AI摘要"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
MkDocs文档AI摘要
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../mkdocs2/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2.Mkdocs配置说明(mkdocs.yml)"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">2.Mkdocs配置说明(mkdocs.yml)</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../../websitebeauty/Mkdocs-AI-Summary/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: MkDocs文档AI摘要"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">MkDocs文档AI摘要</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2881,7 +2891,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2464,6 +2464,10 @@
|
||||
|
||||
<h1>添加Mkdocs博客</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>Mkdocs内置博客插件可快速搭建技术博客，只需在mkdocs.yml中添加简单配置即可启用。支持通过docs/blog/.authors.yml文件管理作者信息，无需额外创建文件。该插件集成度高，适合文档站点快速扩展博客功能，简化了技术内容发布流程。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>114</strong> | 有效代码行数：<strong>19</strong></p>
|
||||
@ -2769,102 +2773,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../websitebeauty/reading_time/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 添加阅读信息统计"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
添加阅读信息统计
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../linktech/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 如何给MKdocs添加友链"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
如何给MKdocs添加友链
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../../websitebeauty/reading_time/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 添加阅读信息统计"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">添加阅读信息统计</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../linktech/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 如何给MKdocs添加友链"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">如何给MKdocs添加友链</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2924,7 +2934,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2597,6 +2597,10 @@
|
||||
|
||||
<h1>0.Mkdocs教程前言</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文介绍了MkDocs文档工具的学习资源和使用指南，包括官方教程、Material主题教程及插件列表，并提供了作者的中文教程（语雀、CSDN、知乎）。内容涵盖快速部署静态网页到GitHub Pages、配置mkdocs.yml及添加博客等核心操作，同时附有视频教程。最后请求使用者注明教程来源并支持友链申请。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>222</strong> | 有效代码行数：<strong>5</strong></p>
|
||||
@ -2965,102 +2969,108 @@ Mkdocs Materials 教程:
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../MIT/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 许可声明"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
许可声明
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../mkdocs1/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 1.利用Mkdocs部署静态网页"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
1.利用Mkdocs部署静态网页
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../../MIT/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 许可声明"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">许可声明</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../mkdocs1/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 1.利用Mkdocs部署静态网页"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">1.利用Mkdocs部署静态网页</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3120,7 +3130,427 @@ Mkdocs Materials 教程:
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2518,102 +2518,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../2022/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2022"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2022
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../../link/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 友链"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
友链
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../2022/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2022"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">2022</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../../../link/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 友链"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">友链</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2673,7 +2679,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2481,6 +2481,10 @@
|
||||
</header>
|
||||
<div class="md-post__content md-typeset">
|
||||
<h2 id="2022"><a class="toclink" href="../../2022/06/06/2022%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/">2022网站更新记录</a></h2>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>2022年网站建设经历了三个阶段：6月确定MKdocs框架并测试早期功能；10月全款购入独立域名并取消cookie确认以优化隐私保护；同月建立Github仓库正式上线，移除cookie弹窗简化访问流程，并新增首页反馈功能。更新重点包括技术框架选型、用户隐私优化及交互体验改进。</p>
|
||||
</div>
|
||||
<h3 id="2022-10-20"><a class="toclink" href="../../2022/06/06/2022%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/#2022-10-20"></p><h1 id="01" name="01"><strong>2022-10-20</strong></h1><p></a></h3>
|
||||
<ul>
|
||||
<li>建立Github仓库，正式建站</li>
|
||||
@ -2533,102 +2537,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../2023/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2023"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2023
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../2021/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2021"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2021
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../2023/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2023"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">2023</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../2021/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2021"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">2021</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2688,7 +2698,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2481,6 +2481,10 @@
|
||||
</header>
|
||||
<div class="md-post__content md-typeset">
|
||||
<h2 id="2023"><a class="toclink" href="../../2023/12/21/2023%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/">2023网站更新记录</a></h2>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文记录了2023年网站的技术更新历程，主要包括：引入AI问答机器人（每月25条限制）、新增多语言支持（含台湾地区）、建立Mkdocs-Wcowin主题、优化移动端适配和页面加载速度。关键改进涉及Latex渲染修复、图片懒加载、友链/博客功能新增，以及持续的性能优化（标注为"玄学"）。技术亮点包括giscus评论系统集成、文楷字体应用和国内镜像部署，整体提升了用户体验和功能完整性。</p>
|
||||
</div>
|
||||
<h3 id="2023-12-21"><a class="toclink" href="../../2023/12/21/2023%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/#2023-12-21"></p><h1 id="01" name="01"><strong>2023-12-21</strong></h1><p></a></h3>
|
||||
<ul>
|
||||
<li>优化网站流畅度（玄学）</li>
|
||||
@ -2626,102 +2630,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../2024/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2024"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2024
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../2022/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2022"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2022
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../2024/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2024"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">2024</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../2022/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2022"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">2022</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2781,7 +2791,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2481,6 +2481,10 @@
|
||||
</header>
|
||||
<div class="md-post__content md-typeset">
|
||||
<h2 id="2024"><a class="toclink" href="../../2024/01/01/2024%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/">2024网站更新记录</a></h2>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>2024年网站持续优化，重点提升流畅度和访问速度，包括启用CDN加速、删除冗余代码、优化UI显示效果。技术改进涉及MKdocs主题更新、代码显示优化、图片迁移至SMMS平台，并引入自动新标签页打开功能。网站被百度/谷歌收录，友链扩展至16位，同时完善了文档修改时间记录功能。</p>
|
||||
</div>
|
||||
<h3 id="2024-12-24"><a class="toclink" href="../../2024/01/01/2024%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/#2024-12-24"></p><h1 id="01" name="01"><strong>2024-12-24</strong></h1><p></a></h3>
|
||||
<ul>
|
||||
<li>优化网站流畅度（玄学）</li>
|
||||
@ -2754,102 +2758,108 @@ Look at this source <a href="https://github.com/JakubAndrysek/mkdocs-open-in-new
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../2025/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2025"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2025
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../2023/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2023"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2023
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../2025/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2025"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">2025</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../2023/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2023"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">2023</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2909,7 +2919,427 @@ Look at this source <a href="https://github.com/JakubAndrysek/mkdocs-open-in-new
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2481,6 +2481,10 @@
|
||||
</header>
|
||||
<div class="md-post__content md-typeset">
|
||||
<h2 id="2025"><a class="toclink" href="../../2025/01/01/2025%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/">2025网站更新记录</a></h2>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>该网站2025年持续优化性能与用户体验，重点提升页面流畅度和加载速度，修复了友链统计、评论区定位等多项功能问题。设计方面引入Material Design圆角化风格，重构页脚样式，并更新教程内容适配最新版本。同时优化了图片查看功能，清理失效链接，改进留言板交互设计，确保网站稳定运行与视觉一致性。</p>
|
||||
</div>
|
||||
<h3 id="2025-07-08"><a class="toclink" href="../../2025/01/01/2025%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/#2025-07-08"></p><h1 id="01" name="01"><strong>2025-07-08</strong></h1><p></a></h3>
|
||||
<ul>
|
||||
<li>优化网站流畅度（玄学）</li>
|
||||
@ -2604,102 +2608,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../category/%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 网站更新记录"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
网站更新记录
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../2024/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2024"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2024
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../../category/%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 网站更新记录"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">网站更新记录</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../2024/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2024"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">2024</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2759,7 +2769,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2518,102 +2518,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: MyBlog"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
MyBlog
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 网站更新记录"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
网站更新记录
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../../"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: MyBlog"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">MyBlog</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 网站更新记录"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">网站更新记录</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2673,7 +2679,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2481,6 +2481,10 @@
|
||||
</header>
|
||||
<div class="md-post__content md-typeset">
|
||||
<h2 id="2025"><a class="toclink" href="../../2025/01/01/2025%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/">2025网站更新记录</a></h2>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>该网站2025年持续优化性能与用户体验，重点提升页面流畅度和加载速度，修复了友链统计、评论区定位等多项功能问题。设计方面引入Material Design圆角化风格，重构页脚样式，并更新教程内容适配最新版本。同时优化了图片查看功能，清理失效链接，改进留言板交互设计，确保网站稳定运行与视觉一致性。</p>
|
||||
</div>
|
||||
<h3 id="2025-07-08"><a class="toclink" href="../../2025/01/01/2025%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/#2025-07-08"></p><h1 id="01" name="01"><strong>2025-07-08</strong></h1><p></a></h3>
|
||||
<ul>
|
||||
<li>优化网站流畅度（玄学）</li>
|
||||
@ -2609,6 +2613,10 @@
|
||||
</header>
|
||||
<div class="md-post__content md-typeset">
|
||||
<h2 id="2024"><a class="toclink" href="../../2024/01/01/2024%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/">2024网站更新记录</a></h2>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>2024年网站持续优化，重点提升流畅度和访问速度，包括启用CDN加速、删除冗余代码、优化UI显示效果。技术改进涉及MKdocs主题更新、代码显示优化、图片迁移至SMMS平台，并引入自动新标签页打开功能。网站被百度/谷歌收录，友链扩展至16位，同时完善了文档修改时间记录功能。</p>
|
||||
</div>
|
||||
<h3 id="2024-12-24"><a class="toclink" href="../../2024/01/01/2024%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/#2024-12-24"></p><h1 id="01" name="01"><strong>2024-12-24</strong></h1><p></a></h3>
|
||||
<ul>
|
||||
<li>优化网站流畅度（玄学）</li>
|
||||
@ -2887,6 +2895,10 @@ Look at this source <a href="https://github.com/JakubAndrysek/mkdocs-open-in-new
|
||||
</header>
|
||||
<div class="md-post__content md-typeset">
|
||||
<h2 id="2023"><a class="toclink" href="../../2023/12/21/2023%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/">2023网站更新记录</a></h2>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文记录了2023年网站的技术更新历程，主要包括：引入AI问答机器人（每月25条限制）、新增多语言支持（含台湾地区）、建立Mkdocs-Wcowin主题、优化移动端适配和页面加载速度。关键改进涉及Latex渲染修复、图片懒加载、友链/博客功能新增，以及持续的性能优化（标注为"玄学"）。技术亮点包括giscus评论系统集成、文楷字体应用和国内镜像部署，整体提升了用户体验和功能完整性。</p>
|
||||
</div>
|
||||
<h3 id="2023-12-21"><a class="toclink" href="../../2023/12/21/2023%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/#2023-12-21"></p><h1 id="01" name="01"><strong>2023-12-21</strong></h1><p></a></h3>
|
||||
<ul>
|
||||
<li>优化网站流畅度（玄学）</li>
|
||||
@ -3037,6 +3049,10 @@ Look at this source <a href="https://github.com/JakubAndrysek/mkdocs-open-in-new
|
||||
</header>
|
||||
<div class="md-post__content md-typeset">
|
||||
<h2 id="2022"><a class="toclink" href="../../2022/06/06/2022%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/">2022网站更新记录</a></h2>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>2022年网站建设经历了三个阶段：6月确定MKdocs框架并测试早期功能；10月全款购入独立域名并取消cookie确认以优化隐私保护；同月建立Github仓库正式上线，移除cookie弹窗简化访问流程，并新增首页反馈功能。更新重点包括技术框架选型、用户隐私优化及交互体验改进。</p>
|
||||
</div>
|
||||
<h3 id="2022-10-20"><a class="toclink" href="../../2022/06/06/2022%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/#2022-10-20"></p><h1 id="01" name="01"><strong>2022-10-20</strong></h1><p></a></h3>
|
||||
<ul>
|
||||
<li>建立Github仓库，正式建站</li>
|
||||
@ -3089,102 +3105,108 @@ Look at this source <a href="https://github.com/JakubAndrysek/mkdocs-open-in-new
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../hello-world/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: Hello World"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
Hello World
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../archive/2025/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2025"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2025
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../hello-world/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: Hello World"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">Hello World</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../../archive/2025/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 2025"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">2025</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3244,7 +3266,427 @@ Look at this source <a href="https://github.com/JakubAndrysek/mkdocs-open-in-new
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
624
blog/index.html
624
blog/index.html
@ -2490,6 +2490,10 @@
|
||||
</header>
|
||||
<div class="md-post__content md-typeset">
|
||||
<h2 id="2025"><a class="toclink" href="2025/01/01/2025%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/">2025网站更新记录</a></h2>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>该网站2025年持续优化性能与用户体验，重点提升页面流畅度和加载速度，修复了友链统计、评论区定位等多项功能问题。设计方面引入Material Design圆角化风格，重构页脚样式，并更新教程内容适配最新版本。同时优化了图片查看功能，清理失效链接，改进留言板交互设计，确保网站稳定运行与视觉一致性。</p>
|
||||
</div>
|
||||
<h3 id="2025-07-08"><a class="toclink" href="2025/01/01/2025%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/#2025-07-08"></p><h1 id="01" name="01"><strong>2025-07-08</strong></h1><p></a></h3>
|
||||
<ul>
|
||||
<li>优化网站流畅度（玄学）</li>
|
||||
@ -2618,6 +2622,10 @@
|
||||
</header>
|
||||
<div class="md-post__content md-typeset">
|
||||
<h2 id="2024"><a class="toclink" href="2024/01/01/2024%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/">2024网站更新记录</a></h2>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>2024年网站持续优化，重点提升流畅度和访问速度，包括启用CDN加速、删除冗余代码、优化UI显示效果。技术改进涉及MKdocs主题更新、代码显示优化、图片迁移至SMMS平台，并引入自动新标签页打开功能。网站被百度/谷歌收录，友链扩展至16位，同时完善了文档修改时间记录功能。</p>
|
||||
</div>
|
||||
<h3 id="2024-12-24"><a class="toclink" href="2024/01/01/2024%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/#2024-12-24"></p><h1 id="01" name="01"><strong>2024-12-24</strong></h1><p></a></h3>
|
||||
<ul>
|
||||
<li>优化网站流畅度（玄学）</li>
|
||||
@ -2896,6 +2904,10 @@ Look at this source <a href="https://github.com/JakubAndrysek/mkdocs-open-in-new
|
||||
</header>
|
||||
<div class="md-post__content md-typeset">
|
||||
<h2 id="2023"><a class="toclink" href="2023/12/21/2023%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/">2023网站更新记录</a></h2>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文记录了2023年网站的技术更新历程，主要包括：引入AI问答机器人（每月25条限制）、新增多语言支持（含台湾地区）、建立Mkdocs-Wcowin主题、优化移动端适配和页面加载速度。关键改进涉及Latex渲染修复、图片懒加载、友链/博客功能新增，以及持续的性能优化（标注为"玄学"）。技术亮点包括giscus评论系统集成、文楷字体应用和国内镜像部署，整体提升了用户体验和功能完整性。</p>
|
||||
</div>
|
||||
<h3 id="2023-12-21"><a class="toclink" href="2023/12/21/2023%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/#2023-12-21"></p><h1 id="01" name="01"><strong>2023-12-21</strong></h1><p></a></h3>
|
||||
<ul>
|
||||
<li>优化网站流畅度（玄学）</li>
|
||||
@ -3046,6 +3058,10 @@ Look at this source <a href="https://github.com/JakubAndrysek/mkdocs-open-in-new
|
||||
</header>
|
||||
<div class="md-post__content md-typeset">
|
||||
<h2 id="2022"><a class="toclink" href="2022/06/06/2022%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/">2022网站更新记录</a></h2>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>2022年网站建设经历了三个阶段：6月确定MKdocs框架并测试早期功能；10月全款购入独立域名并取消cookie确认以优化隐私保护；同月建立Github仓库正式上线，移除cookie弹窗简化访问流程，并新增首页反馈功能。更新重点包括技术框架选型、用户隐私优化及交互体验改进。</p>
|
||||
</div>
|
||||
<h3 id="2022-10-20"><a class="toclink" href="2022/06/06/2022%E7%BD%91%E7%AB%99%E6%9B%B4%E6%96%B0%E8%AE%B0%E5%BD%95/#2022-10-20"></p><h1 id="01" name="01"><strong>2022-10-20</strong></h1><p></a></h3>
|
||||
<ul>
|
||||
<li>建立Github仓库，正式建站</li>
|
||||
@ -3140,104 +3156,108 @@ Look at this source <a href="https://github.com/JakubAndrysek/mkdocs-open-in-new
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
hidden
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../liuyanban/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 留言板"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
留言板
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="category/hello-world/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: Hello World"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
Hello World
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
hidden
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../liuyanban/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 留言板"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">留言板</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="category/hello-world/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: Hello World"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">Hello World</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3297,7 +3317,427 @@ Look at this source <a href="https://github.com/JakubAndrysek/mkdocs-open-in-new
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -3892,102 +3892,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../Relativeaddress/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 相对地址的一些问题"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
相对地址的一些问题
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../time/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 为MKdocs添加文章修订时间戳"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
为MKdocs添加文章修订时间戳
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../Relativeaddress/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 相对地址的一些问题"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">相对地址的一些问题</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../time/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 为MKdocs添加文章修订时间戳"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">为MKdocs添加文章修订时间戳</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -4047,7 +4053,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -3484,6 +3484,10 @@
|
||||
|
||||
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>该项目为MkDocs文档系统开发了AI智能摘要插件，支持DeepSeek、OpenAI等主流AI服务，可自动生成80-120字的多语言摘要。具备智能内容清理、缓存优化和灵活配置功能，并提供阅读统计、代码识别等辅助特性。通过hooks机制实现无缝集成，支持本地和CI环境自适应，显著提升技术文档的可读性和管理效率。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>2</strong> 分钟 | 中文字符：<strong>904</strong> | 有效代码行数：<strong>205</strong></p>
|
||||
@ -4428,102 +4432,108 @@ ai_summary.py务必放到docs/overrides/hooks目录下，然后：
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../Mkdocs/mkdocs3/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 3.解决Github Pages部署mkdocs自定义域名失效的问题"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
3.解决Github Pages部署mkdocs自定义域名失效的问题
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../reading_time/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 添加阅读信息统计"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
添加阅读信息统计
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../../Mkdocs/mkdocs3/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 3.解决Github Pages部署mkdocs自定义域名失效的问题"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">3.解决Github Pages部署mkdocs自定义域名失效的问题</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../reading_time/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 添加阅读信息统计"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">添加阅读信息统计</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -4583,7 +4593,427 @@ ai_summary.py务必放到docs/overrides/hooks目录下，然后：
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2619,6 +2619,10 @@
|
||||
|
||||
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文探讨了MkDocs中相对地址引用的常见问题与解决方案，重点分析了图片、PDF、跨页面及静态资源的正确引用方式。指出路径大小写敏感性和以<code>docs</code>目录为基准的关键要点，并针对本地与线上环境差异提供了调试建议。通过规范目录结构和统一相对路径写法，可确保资源在不同环境下正常加载，提升文档系统的可维护性。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>493</strong> | 有效代码行数：<strong>6</strong></p>
|
||||
@ -2928,102 +2932,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../mkpdf/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 嵌入PDF文件"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
嵌入PDF文件
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../404/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 添加404页面"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
添加404页面
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../mkpdf/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 嵌入PDF文件"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">嵌入PDF文件</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../404/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 添加404页面"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">添加404页面</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3083,7 +3093,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2565,6 +2565,10 @@
|
||||
|
||||
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文介绍了使用MkDocs构建网站时的性能优化方法，包括采用WebP等高效图片格式压缩资源、通过CDN分发静态文件减少延迟，以及优化git插件配置加速本地渲染。建议开发时禁用非必要插件，并推荐使用jsDelivr CDN和Lighthouse工具进行效果验证，有效提升网站访问速度。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>257</strong> | 有效代码行数：<strong>6</strong></p>
|
||||
@ -2857,102 +2861,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../footer/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 页脚设置"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
页脚设置
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../../develop/Markdown/markdown/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: Markdown指南"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
Markdown指南
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../footer/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 页脚设置"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">页脚设置</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../../../develop/Markdown/markdown/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: Markdown指南"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">Markdown指南</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3012,7 +3022,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2579,6 +2579,10 @@
|
||||
|
||||
<h1>背景特效</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>该技术文档介绍了三种网页背景特效的实现方法：雪花、樱花和粒子效果。核心是通过JavaScript动态加载特效脚本，并利用LocalStorage控制特效的显示状态。代码示例展示了如何通过DOM操作插入外部脚本，实现可配置的动态视觉效果，适用于增强网页交互体验。关键技术点包括LocalStorage的状态管理和动态资源加载。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>48</strong> | 有效代码行数：<strong>374</strong></p>
|
||||
@ -3683,102 +3687,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../shubiao/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: JS实现鼠标样式"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
JS实现鼠标样式
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../mkpdf/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 嵌入PDF文件"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
嵌入PDF文件
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../shubiao/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: JS实现鼠标样式"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">JS实现鼠标样式</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../mkpdf/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 嵌入PDF文件"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">嵌入PDF文件</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3838,7 +3848,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2543,6 +2543,10 @@
|
||||
|
||||
<h1>页脚设置</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>MkDocs支持通过自定义HTML文件实现页脚个性化配置。用户需在docs/overrides/partials目录下创建或修改footer.html文件，插入特定代码片段即可完成设置。该功能适用于需要定制网站底部信息的场景，操作简单且无需修改核心配置文件。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>60</strong> | 有效代码行数：<strong>89</strong></p>
|
||||
@ -3001,102 +3005,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../time/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 为MKdocs添加文章修订时间戳"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
为MKdocs添加文章修订时间戳
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../accelerate/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 加速网站访问的一些心得"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
加速网站访问的一些心得
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../time/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 为MKdocs添加文章修订时间戳"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">为MKdocs添加文章修订时间戳</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../accelerate/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 加速网站访问的一些心得"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">加速网站访问的一些心得</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3156,7 +3166,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2464,6 +2464,10 @@
|
||||
|
||||
<h1>添加顶部公告栏</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文介绍如何在文档项目中添加顶部公告栏，通过修改<code>docs/overrides/main.html</code>文件实现自定义公告内容。操作步骤包括创建文件目录结构、编辑HTML代码以及灵活调整公告样式。该方法适用于需要突出显示重要通知的技术文档系统，具有配置简单、维护方便的特点。</p>
|
||||
</div>
|
||||
<p><img alt="image.png" src="https://s2.loli.net/2024/02/02/mvCEgeP4lANuXI8.png" /></p>
|
||||
<p>docs/overrides下新建main.html ，针对main.html文件 <br />
|
||||
树状结构如下:<br />
|
||||
@ -2820,102 +2824,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../linktech/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 添加友链"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
添加友链
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../mkdocsfont/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 修改网站字体"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
修改网站字体
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../linktech/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 添加友链"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">添加友链</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../mkdocsfont/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 修改网站字体"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">修改网站字体</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2975,7 +2985,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -3066,104 +3066,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../webtalknow/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 添加在线聊天"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
添加在线聊天
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../header/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 添加顶部公告栏"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
添加顶部公告栏
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../webtalknow/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 添加在线聊天"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">添加在线聊天</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../header/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 添加顶部公告栏"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">添加顶部公告栏</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3223,7 +3227,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2597,6 +2597,10 @@
|
||||
|
||||
<h1>添加评论系统(giscus为例)</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>giscus是一款基于GitHub Discussions的开源评论系统，无需数据库，数据直接存储在GitHub中。它具有无跟踪、无广告、永久免费的特点，支持多语言、自定义主题和高可配置性。系统能自动同步GitHub的评论更新，适用于静态网站集成，提供轻量级且隐私友好的评论解决方案。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>389</strong> | 有效代码行数：<strong>116</strong></p>
|
||||
@ -3219,102 +3223,108 @@ twikoo.init({
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../yuanjiaohua/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 网页圆角化设计"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
网页圆角化设计
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../webtalknow/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 添加在线聊天"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
添加在线聊天
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../yuanjiaohua/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 网页圆角化设计"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">网页圆角化设计</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../webtalknow/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 添加在线聊天"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">添加在线聊天</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3374,7 +3384,427 @@ twikoo.init({
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2781,6 +2781,10 @@
|
||||
|
||||
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>霞鹜文楷是一款基于日本FONTWORKS公司Klee One衍生的开源中文字体，兼具仿宋和楷体特点，适用于屏幕阅读和排版。该字体提供多个版本，包括屏幕阅读版、轻便版、GB/TC规范版等，支持简繁日韩字符。作为开源项目，它解决了商业字体侵权风险问题，并通过深度学习补全了6857个汉字字形。用户可通过GitHub、Gitee等平台获取，支持Windows、macOS等系统安装。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>6</strong> 分钟 | 中文字符：<strong>2328</strong> | 有效代码行数：<strong>21</strong></p>
|
||||
@ -3192,102 +3196,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../header/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 添加顶部公告栏"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
添加顶部公告栏
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../shubiao/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: JS实现鼠标样式"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
JS实现鼠标样式
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../header/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 添加顶部公告栏"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">添加顶部公告栏</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../shubiao/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: JS实现鼠标样式"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">JS实现鼠标样式</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3347,7 +3357,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2749,102 +2749,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../backgroud/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 背景特效"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
背景特效
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../Relativeaddress/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 相对地址的一些问题"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
相对地址的一些问题
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../backgroud/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 背景特效"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">背景特效</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../Relativeaddress/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 相对地址的一些问题"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">相对地址的一些问题</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2904,7 +2910,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2700,6 +2700,10 @@
|
||||
|
||||
<h1>添加阅读信息统计</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文介绍了如何在MkDocs文档系统中实现阅读时间统计功能。通过创建reading_time.py脚本并配置mkdocs.yml文件，系统可自动计算文章阅读时长、中文字符数和代码行数。支持通过hide_reading_time参数排除特定页面，并提供EXCLUDE_PATTERNS正则表达式进行批量过滤。该功能适用于技术文档网站，能帮助读者预估阅读时间，提升用户体验。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>142</strong> | 有效代码行数：<strong>268</strong></p>
|
||||
@ -3602,102 +3606,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../Mkdocs-AI-Summary/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: MkDocs文档AI摘要"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
MkDocs文档AI摘要
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../Mkdocs/mkdocsblog/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 添加Mkdocs博客"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
添加Mkdocs博客
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../Mkdocs-AI-Summary/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: MkDocs文档AI摘要"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">MkDocs文档AI摘要</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../../Mkdocs/mkdocsblog/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 添加Mkdocs博客"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">添加Mkdocs博客</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3757,7 +3767,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2464,6 +2464,10 @@
|
||||
|
||||
<h1>JS实现鼠标样式</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文介绍了通过JavaScript和CSS自定义网页鼠标样式的方法，重点说明了关键参数设置，包括鼠标尺寸、颜色（支持RGB值和颜色名称）以及跟随圆形的颜色调整。提供了具体的代码实现步骤，并强调需在mkdocs.yml中正确引入相关文件。适用于需要个性化鼠标交互效果的网页开发场景。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>129</strong> | 有效代码行数：<strong>114</strong></p>
|
||||
@ -2993,102 +2997,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../mkdocsfont/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 修改网站字体"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
修改网站字体
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../backgroud/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 背景特效"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
背景特效
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../mkdocsfont/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 修改网站字体"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">修改网站字体</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../backgroud/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 背景特效"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">背景特效</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3148,7 +3158,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2561,6 +2561,10 @@
|
||||
|
||||
<h1>为MKdocs添加文章修订时间戳</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文介绍如何通过git-revision-date-localized插件为MKdocs文档添加文章修订时间戳。该方法通过修改CI工作流配置，优化了本地渲染性能，仅在发布时获取Git历史记录，既提升了构建速度，又能在页面底部准确显示文档最后更新时间。适用于需要展示文档时效性的技术文档项目。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>203</strong> | 有效代码行数：<strong>51</strong></p>
|
||||
@ -2930,102 +2934,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../404/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 添加404页面"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
添加404页面
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../footer/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 页脚设置"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
页脚设置
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../404/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 添加404页面"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">添加404页面</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../footer/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 页脚设置"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">页脚设置</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3085,7 +3095,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2561,6 +2561,10 @@
|
||||
|
||||
<h1>添加在线聊天</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>Tidio提供免费、无需梯子的在线聊天解决方案，适用于网站集成。用户只需注册账户，从设置中获取专属JavaScript代码，并将其嵌入网站指定位置即可快速部署。该工具安装简便，仅需粘贴一行代码，支持实时聊天功能，适合中小型网站提升客户互动效率。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>182</strong> | 有效代码行数：<strong>1</strong></p>
|
||||
@ -2833,102 +2837,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../mkcomments/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 添加评论系统(giscus为例)"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
添加评论系统(giscus为例)
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../linktech/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 添加友链"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
添加友链
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../mkcomments/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 添加评论系统(giscus为例)"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">添加评论系统(giscus为例)</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../linktech/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 添加友链"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">添加友链</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2988,7 +2998,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2615,6 +2615,10 @@
|
||||
|
||||
<h1>网页圆角化设计</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文介绍了网页圆角化设计的实现方法，重点讲解了通过CSS样式实现图片和边框圆角效果的技术方案。内容包括创建CSS文件、在配置文件中引入样式、具体代码实现示例以及实际效果展示，同时提供了按钮圆角化设计的实现方式。这些方法适用于美化网页元素，提升界面视觉效果，适用于各类网站建设项目。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>66</strong> | 有效代码行数：<strong>213</strong></p>
|
||||
@ -3498,102 +3502,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../Mkdocs/linktech/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 如何给MKdocs添加友链"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
如何给MKdocs添加友链
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../mkcomments/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 添加评论系统(giscus为例)"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
添加评论系统(giscus为例)
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../../Mkdocs/linktech/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 如何给MKdocs添加友链"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">如何给MKdocs添加友链</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../mkcomments/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 添加评论系统(giscus为例)"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">添加评论系统(giscus为例)</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3653,7 +3663,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2929,6 +2929,10 @@
|
||||
|
||||
<h1>MWeb Pro</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>MWeb Pro是一款专为macOS设计的专业Markdown写作与笔记应用，支持GFM语法扩展（包括表格、LaTeX、代码块等）和多种图表库（如mermaid、PlantUML）。提供便捷的图片插入、表格编辑和LaTeX辅助功能，支持导出多种格式（PDF、HTML等）并发布到主流平台（WordPress、印象笔记等）。其强大的文档库支持分类树和标签管理，适合知识收集与静态网站生成，兼具快速笔记和全局搜索功能，优化写作与内容管理体验。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>3</strong> 分钟 | 中文字符：<strong>1009</strong> | 有效代码行数：<strong>67</strong></p>
|
||||
@ -3471,102 +3475,108 @@ option = {
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../markdown/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: Markdown指南"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
Markdown指南
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../git/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: Git 实用技巧"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
Git 实用技巧
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../markdown/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: Markdown指南"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">Markdown指南</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../../git/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: Git 实用技巧"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">Git 实用技巧</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3626,7 +3636,427 @@ option = {
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -3143,6 +3143,10 @@
|
||||
|
||||
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>Markdown是一种轻量级标记语言，支持纯文本编写并转换为多种格式（如HTML、PDF）。本文介绍了其核心语法，包括标题、列表、表格、链接、图片插入等常用功能，并推荐了各平台编辑工具。通过简洁的标记符号实现文档格式化，适用于快速编写易读易写的技术文档和笔记。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>2</strong> 分钟 | 中文字符：<strong>662</strong> | 有效代码行数：<strong>67</strong></p>
|
||||
@ -3863,102 +3867,108 @@ Markdown 编写的文档可以导出 HTML 、Word、图像、PDF、Epub 等多
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../../blog/websitebeauty/accelerate/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 加速网站访问的一些心得"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
加速网站访问的一些心得
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../MWeb/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: MWeb Pro"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
MWeb Pro
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../../../blog/websitebeauty/accelerate/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 加速网站访问的一些心得"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">加速网站访问的一些心得</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../MWeb/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: MWeb Pro"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">MWeb Pro</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -4018,7 +4028,427 @@ Markdown 编写的文档可以导出 HTML 、Word、图像、PDF、Epub 等多
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2603,6 +2603,10 @@
|
||||
|
||||
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>唐·诺曼提出的情感设计三层次理论包括本能层、行为层和反思层。本能层关注产品外观引发的即时情感反应，行为层强调使用过程中的功能性和效率，反思层涉及用户对产品的理性评价和自我认同。这三个层次相互影响，共同塑造用户对产品的整体体验。该理论为设计提供了系统框架，帮助平衡美学、功能与情感诉求，广泛应用于产品开发与用户体验优化。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>5</strong> 分钟 | 中文字符：<strong>2163</strong></p>
|
||||
@ -2884,102 +2888,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../vercel/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 如何将 github pages 迁移到 vercel 上托管"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
如何将 github pages 迁移到 vercel 上托管
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../my-to-desihn/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 我对设计的一些观点"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
我对设计的一些观点
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../../vercel/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 如何将 github pages 迁移到 vercel 上托管"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">如何将 github pages 迁移到 vercel 上托管</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../my-to-desihn/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 我对设计的一些观点"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">我对设计的一些观点</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3039,7 +3049,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2473,6 +2473,10 @@
|
||||
|
||||
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文阐述了设计的核心原则与实践要点，强调简洁性、美感和用户体验的重要性。作者提出优秀设计应去除冗余元素，注重视觉平衡与细节把控，同时以用户需求为导向创造直观交互。创新思维和情感共鸣被视作关键要素，通过故事性表达和突破性方案提升产品价值。全文突出了设计在功能性与艺术性之间的平衡，以及其对用户认知和情感的影响。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>398</strong></p>
|
||||
@ -2761,102 +2765,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../db1/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 唐·诺曼—情感设计的三个层次"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
唐·诺曼—情感设计的三个层次
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../../../tag/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 标签"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
标签
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../db1/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 唐·诺曼—情感设计的三个层次"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">唐·诺曼—情感设计的三个层次</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../../../tag/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 标签"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">标签</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2916,7 +2926,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2879,6 +2879,10 @@
|
||||
|
||||
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>本文系统介绍了Git的核心操作与实用技巧，涵盖仓库创建、分支管理、冲突解决等基础功能，重点讲解了stash暂存、rebase/merge策略选择、cherry-pick热修复等高级用法。通过具体代码示例和操作图示，帮助开发者掌握版本控制关键场景的解决方案，提升团队协作效率与代码管理能力。</p>
|
||||
</div>
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">📖 阅读信息</p>
|
||||
<p>阅读时间：<strong>1</strong> 分钟 | 中文字符：<strong>199</strong> | 有效代码行数：<strong>48</strong></p>
|
||||
@ -3325,102 +3329,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../Markdown/MWeb/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: MWeb Pro"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
MWeb Pro
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../lighthouse/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 利用Lighthouse测试网站性能"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
利用Lighthouse测试网站性能
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../Markdown/MWeb/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: MWeb Pro"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">MWeb Pro</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../lighthouse/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 利用Lighthouse测试网站性能"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">利用Lighthouse测试网站性能</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3480,7 +3490,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2466,6 +2466,10 @@
|
||||
|
||||
<h1>利用Lighthouse测试网站性能</h1>
|
||||
|
||||
<div class="admonition info">
|
||||
<p class="admonition-title">💾 AI智能摘要 (DeepSeek)</p>
|
||||
<p>Lighthouse是谷歌开发的网站性能测试工具，可评估页面加载速度、可访问性等关键指标。用户通过浏览器开发者工具（F12）即可快速运行测试，无需额外安装。该工具提供量化评分和优化建议，帮助开发者识别性能瓶颈，适用于各类网站的持续性能监控与改进。测试结果包含SEO、PWA等维度，是前端优化的标准工具之一。</p>
|
||||
</div>
|
||||
<p><img alt="image.png" src="https://s2.loli.net/2024/02/04/yxwcmJLXADqMa8P.png" /></p>
|
||||
<p><img width="1363" alt="image" src="https://s2.loli.net/2025/01/02/VHeITXxJgwOKSsu.jpg">
|
||||
可以看到我的网站性能还是不错的，如果你想测试自己的网站性能，可以尝试一下 </p>
|
||||
@ -2726,102 +2730,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../git/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: Git 实用技巧"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
Git 实用技巧
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../vercel/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 如何将 github pages 迁移到 vercel 上托管"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
如何将 github pages 迁移到 vercel 上托管
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../git/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: Git 实用技巧"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">Git 实用技巧</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../vercel/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 如何将 github pages 迁移到 vercel 上托管"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">如何将 github pages 迁移到 vercel 上托管</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2881,7 +2891,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2725,102 +2725,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../lighthouse/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 利用Lighthouse测试网站性能"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
利用Lighthouse测试网站性能
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../designbeauty/db1/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 唐·诺曼—情感设计的三个层次"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
唐·诺曼—情感设计的三个层次
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
|
||||
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../lighthouse/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 利用Lighthouse测试网站性能"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">利用Lighthouse测试网站性能</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../designbeauty/db1/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 唐·诺曼—情感设计的三个层次"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">唐·诺曼—情感设计的三个层次</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2880,7 +2886,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
513
en/index.html
513
en/index.html
@ -2850,47 +2850,68 @@ t.parentNode.insertBefore(e,t)}})();
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2950,7 +2971,427 @@ t.parentNode.insertBefore(e,t)}})();
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
519
index.html
519
index.html
@ -2590,7 +2590,7 @@ ____ __ ____ ______ ______ ____ __ ____ __ .__ __.
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<body>
|
||||
<!-- <body>
|
||||
<font color="#B9B9B9">
|
||||
<p style="text-align: center; ">
|
||||
<span>本站已经运行</span>
|
||||
@ -2617,7 +2617,7 @@ ____ __ ____ ______ ______ ____ __ ____ __ .__ __.
|
||||
},1000)
|
||||
</script>
|
||||
</font>
|
||||
</body>
|
||||
</body> -->
|
||||
|
||||
<!-- <script src="//code.tidio.co/6jmawe9m5wy4ahvlhub2riyrnujz7xxi.js" async></script> -->
|
||||
|
||||
@ -2747,7 +2747,7 @@ body::before {
|
||||
<span class="md-icon" title="最后更新">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21 13.1c-.1 0-.3.1-.4.2l-1 1 2.1 2.1 1-1c.2-.2.2-.6 0-.8l-1.3-1.3c-.1-.1-.2-.2-.4-.2m-1.9 1.8-6.1 6V23h2.1l6.1-6.1zM12.5 7v5.2l4 2.4-1 1L11 13V7zM11 21.9c-5.1-.5-9-4.8-9-9.9C2 6.5 6.5 2 12 2c5.3 0 9.6 4.1 10 9.3-.3-.1-.6-.2-1-.2s-.7.1-1 .2C19.6 7.2 16.2 4 12 4c-4.4 0-8 3.6-8 8 0 4.1 3.1 7.5 7.1 7.9l-.1.2z"/></svg>
|
||||
</span>
|
||||
<span class="git-revision-date-localized-plugin git-revision-date-localized-plugin-iso_date" title="2025年7月8日 02:51:10 UTC">2025-07-08</span>
|
||||
<span class="git-revision-date-localized-plugin git-revision-date-localized-plugin-iso_date" title="2025年7月8日 03:47:16 UTC">2025-07-08</span>
|
||||
</span>
|
||||
|
||||
|
||||
@ -2846,47 +2846,68 @@ body::before {
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2946,7 +2967,427 @@ body::before {
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
608
link/index.html
608
link/index.html
@ -2914,104 +2914,108 @@ t.parentNode.insertBefore(e,t)}})();
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
hidden
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../blog/archive/2021/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2021"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
2021
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../about/geren/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 作者个人简介"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
作者个人简介
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
hidden
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../blog/archive/2021/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 2021"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">2021</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../about/geren/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 作者个人简介"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">作者个人简介</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3071,7 +3075,427 @@ t.parentNode.insertBefore(e,t)}})();
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -2734,104 +2734,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
hidden
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../tag/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 标签"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
标签
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../blog/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: MyBlog"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
MyBlog
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
hidden
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../tag/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 标签"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">标签</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../blog/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: MyBlog"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">MyBlog</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -2891,7 +2895,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -1,92 +1,532 @@
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
{% if "navigation.footer" in features %}
|
||||
{% if page.previous_page or page.next_page %}
|
||||
{% if page.meta and page.meta.hide %}
|
||||
{% set hidden = "hidden" if "footer" in page.meta.hide %}
|
||||
{% endif %}
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="{{ lang.t('footer') }}"
|
||||
{{ hidden }}
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
{% if page.previous_page %}
|
||||
{% set direction = lang.t("footer.previous") %}
|
||||
<a
|
||||
href="{{ page.previous_page.url | url }}"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="{{ direction }}: {{ page.previous_page.title | e }}"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
{% set icon = config.theme.icon.previous or "material/arrow-left" %}
|
||||
{% include ".icons/" ~ icon ~ ".svg" %}
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
{{ direction }}
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
{{ page.previous_page.title }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
<!-- Link to next page -->
|
||||
{% if page.next_page %}
|
||||
{% set direction = lang.t("footer.next") %}
|
||||
<a
|
||||
href="{{ page.next_page.url | url }}"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="{{ direction }}: {{ page.next_page.title | e }}"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
{{ direction }}
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
{{ page.next_page.title }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
{% set icon = config.theme.icon.next or "material/arrow-right" %}
|
||||
{% include ".icons/" ~ icon ~ ".svg" %}
|
||||
</div>
|
||||
</a>
|
||||
{% endif %}
|
||||
</nav>
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
{% if "navigation.footer" in features %} {% if page.previous_page or
|
||||
page.next_page %} {% if page.meta and page.meta.hide %} {% set hidden =
|
||||
"hidden" if "footer" in page.meta.hide %} {% endif %}
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="{{ lang.t('footer') }}"
|
||||
{{ hidden }}
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
{% if page.previous_page %} {% set direction = lang.t("footer.previous") %}
|
||||
<a
|
||||
href="{{ page.previous_page.url | url }}"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="{{ direction }}: {{ page.previous_page.title | e }}"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
{% set icon = config.theme.icon.previous or "material/arrow-left" %} {%
|
||||
include ".icons/" ~ icon ~ ".svg" %}
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> {{ direction }} </span>
|
||||
<div class="md-ellipsis">{{ page.previous_page.title }}</div>
|
||||
</div>
|
||||
</a>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
<!-- Link to next page -->
|
||||
{% if page.next_page %} {% set direction = lang.t("footer.next") %}
|
||||
<a
|
||||
href="{{ page.next_page.url | url }}"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="{{ direction }}: {{ page.next_page.title | e }}"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> {{ direction }} </span>
|
||||
<div class="md-ellipsis">{{ page.next_page.title }}</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
{% set icon = config.theme.icon.next or "material/arrow-right" %} {%
|
||||
include ".icons/" ~ icon ~ ".svg" %}
|
||||
</div>
|
||||
</a>
|
||||
{% endif %}
|
||||
</nav>
|
||||
{% endif %} {% endif %}
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
{% include "partials/copyright.html" %}
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
{% if config.extra.social %}
|
||||
<div class="footer-social">
|
||||
{% include "partials/social.html" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
</style>
|
||||
{% if config.extra.social %}
|
||||
{% include "partials/social.html" %}
|
||||
{% endif %}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</footer>
|
||||
File diff suppressed because one or more lines are too long
@ -1,7 +1,7 @@
|
||||
:root > * {
|
||||
--md-primary-fg-color: #4c94cb;
|
||||
--md-primary-fg-color--light:#4c94cb;
|
||||
--md-primary-fg-color--dark: #4c94cb;
|
||||
--md-primary-fg-color: #1D2636;
|
||||
--md-primary-fg-color--light:#1D2636;
|
||||
--md-primary-fg-color--dark: #1D2636;
|
||||
|
||||
}
|
||||
/* 给所有元素加上边框 */
|
||||
@ -15,7 +15,7 @@ button.md-top {
|
||||
font-family: LXGW WenKai; /* 修改字体 */
|
||||
font-size: 16px; /* 修改字体大小 */
|
||||
font-weight: lighter;/* 修改字体粗细 */
|
||||
color: #518FC1; /* 修改字体颜色 */
|
||||
color: #1D2636; /* 修改字体颜色 */
|
||||
}
|
||||
|
||||
:root {
|
||||
|
||||
608
tag/index.html
608
tag/index.html
@ -2935,104 +2935,108 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="md-footer">
|
||||
|
||||
<!-- Link to previous and/or next page -->
|
||||
|
||||
|
||||
<!-- Link to previous and/or next page - 移到最上面 -->
|
||||
|
||||
|
||||
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
hidden
|
||||
>
|
||||
|
||||
<!-- Link to previous page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../develop/designbeauty/my-to-desihn/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 我对设计的一些观点"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
上一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
我对设计的一些观点
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
|
||||
<a
|
||||
href="../liuyanban/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 留言板"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction">
|
||||
下一页
|
||||
</span>
|
||||
<div class="md-ellipsis">
|
||||
留言板
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
<nav
|
||||
class="md-footer__inner md-grid"
|
||||
aria-label="页脚"
|
||||
hidden
|
||||
>
|
||||
<!-- Link to previous page -->
|
||||
|
||||
<a
|
||||
href="../develop/designbeauty/my-to-desihn/"
|
||||
class="md-footer__link md-footer__link--prev"
|
||||
aria-label="上一页: 我对设计的一些观点"
|
||||
>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256l137.3-137.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
||||
</div>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 上一页 </span>
|
||||
<div class="md-ellipsis">我对设计的一些观点</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
<!-- Link to next page -->
|
||||
|
||||
<a
|
||||
href="../liuyanban/"
|
||||
class="md-footer__link md-footer__link--next"
|
||||
aria-label="下一页: 留言板"
|
||||
>
|
||||
<div class="md-footer__title">
|
||||
<span class="md-footer__direction"> 下一页 </span>
|
||||
<div class="md-ellipsis">留言板</div>
|
||||
</div>
|
||||
<div class="md-footer__button md-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Further information -->
|
||||
<div class="md-footer-meta md-typeset">
|
||||
<div class="md-footer-meta__inner md-grid">
|
||||
<div class="md-copyright">
|
||||
|
||||
<div class="md-copyright__highlight">
|
||||
Copyright © 2022~2025 Wcowin
|
||||
</div>
|
||||
|
||||
|
||||
Made with
|
||||
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
|
||||
Material for MkDocs
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
<font color="#B9B9B9">
|
||||
<div class="footer-visit-count" style="display: flex; justify-content: center; align-items: center;">
|
||||
本站访问量：<script async src="//finicounter.eu.org/finicounter.js"></script>
|
||||
<span id="finicount_views"></span> |
|
||||
<footer>
|
||||
<a href="https://icp.gov.moe/?keyword=20230640" target="_blank">萌ICP备20230640号</a>
|
||||
</footer>
|
||||
</div>
|
||||
</font>
|
||||
<div class="footer-wrapper">
|
||||
<!-- 访问统计区域 -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-visit-count">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">👀</span> -->
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views" class="footer-highlight"></span>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.footer-visit-count {
|
||||
height: fit-content;
|
||||
min-height: 55px; /* 根据实际情况调整此高度 */
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="md-social">
|
||||
<div class="footer-item">
|
||||
<!-- <span class="footer-icon">📝</span> -->
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-item runtime-info">
|
||||
<!-- <span class="footer-icon">⏱️</span> -->
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1" class="footer-highlight"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端简洁布局 (仿 footercopy.html) -->
|
||||
<div class="footer-visit-count-mobile">
|
||||
<span>本站访问量：</span>
|
||||
<span id="finicount_views_mobile" class="footer-highlight"></span>
|
||||
|
|
||||
<a
|
||||
href="https://icp.gov.moe/?keyword=20230640"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="icp-link"
|
||||
>萌ICP备20230640号</a>
|
||||
<!-- | -->
|
||||
<span class="runtime-info">
|
||||
<span>本站已经运行</span>
|
||||
<span id="box1_mobile"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- 版权信息和社交媒体水平布局 -->
|
||||
<div class="footer-bottom-section">
|
||||
<div class="md-footer-copyright">
|
||||
<p>Copyright © 2022-2025 Wcowin</p>
|
||||
<p>Made with <a href="https://squidfunk.github.io/mkdocs-material/" style="color: #518FC1; text-decoration: none;">Material for MkDocs</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer-social">
|
||||
<div class="md-social">
|
||||
|
||||
|
||||
|
||||
@ -3092,7 +3096,427 @@
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
// 避免变量冲突，将所有代码包装在立即执行函数中
|
||||
|
||||
function timingTime() {
|
||||
const start = "2023-10-14T00:00:00";
|
||||
const startTime = new Date(start).getTime();
|
||||
const now = Date.now();
|
||||
let diff = Math.floor((now - startTime) / 1000);
|
||||
const days = Math.floor(diff / 86400);
|
||||
diff %= 86400;
|
||||
const hours = Math.floor(diff / 3600);
|
||||
diff %= 3600;
|
||||
const minutes = Math.floor(diff / 60);
|
||||
const seconds = diff % 60;
|
||||
return `${days}天${hours}时${minutes}分${seconds}秒`;
|
||||
}
|
||||
|
||||
// 简化的计时器更新函数
|
||||
function updateTime() {
|
||||
const el = document.getElementById("box1");
|
||||
const elMobile = document.getElementById("box1_mobile");
|
||||
const time = timingTime();
|
||||
|
||||
if (el) el.textContent = time;
|
||||
if (elMobile) elMobile.textContent = time;
|
||||
}
|
||||
|
||||
// 加载访问量计数器
|
||||
async function loadVisitCounter() {
|
||||
try {
|
||||
const script = document.createElement('script');
|
||||
script.src = '//finicounter.eu.org/finicounter.js';
|
||||
script.async = true;
|
||||
script.onerror = function() {
|
||||
console.log('访问量计数器加载失败，使用备用显示');
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop) desktop.textContent = '统计中...';
|
||||
if (mobile) mobile.textContent = '统计中...';
|
||||
};
|
||||
document.head.appendChild(script);
|
||||
} catch (e) {
|
||||
console.log('访问量计数器初始化失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 同步访问量显示
|
||||
function syncVisitCount() {
|
||||
const desktop = document.getElementById("finicount_views");
|
||||
const mobile = document.getElementById("finicount_views_mobile");
|
||||
if (desktop && mobile && desktop.textContent && desktop.textContent !== '加载中...') {
|
||||
mobile.textContent = desktop.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
// 监听访问量更新
|
||||
function setupVisitCountObserver() {
|
||||
try {
|
||||
const observer = new MutationObserver(syncVisitCount);
|
||||
const visitCountTarget = document.getElementById("finicount_views");
|
||||
if (visitCountTarget) {
|
||||
observer.observe(visitCountTarget, { childList: true, subtree: true });
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('访问量监听器设置失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化所有功能
|
||||
function init() {
|
||||
// 启动计时器
|
||||
updateTime();
|
||||
setInterval(updateTime, 1000);
|
||||
|
||||
// 加载访问量计数器
|
||||
loadVisitCounter();
|
||||
|
||||
// 设置访问量同步
|
||||
setupVisitCountObserver();
|
||||
|
||||
// 调试信息
|
||||
console.log('页脚功能已启动');
|
||||
console.log('当前时间:', timingTime());
|
||||
}
|
||||
|
||||
// 确保DOM加载完成后再初始化
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 页脚背景配色方案 - 可根据喜好选择 */
|
||||
|
||||
/* 方案1: 现代深蓝灰色调 (当前使用) */
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
/* 方案2: 优雅紫色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #2d1b69 0%, #4c1d95 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1e1b4b 0%, #2d1b69 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案3: 温暖深绿色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #14532d 0%, #166534 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #052e16 0%, #14532d 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 方案4: 经典深灰色调 (取消注释使用)
|
||||
.md-footer {
|
||||
background: linear-gradient(135deg, #374151 0%, #4b5563 100%);
|
||||
}
|
||||
|
||||
.md-footer-meta {
|
||||
background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
|
||||
}
|
||||
*/
|
||||
|
||||
/* 整体页脚容器 */
|
||||
.footer-wrapper {
|
||||
width: 100%;
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 版权信息和社交媒体水平布局 */
|
||||
.footer-bottom-section {
|
||||
max-width: 900px;
|
||||
margin: 0.4rem auto 0;
|
||||
padding: 0.4rem 1rem;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 版权信息 */
|
||||
.md-footer-copyright {
|
||||
text-align: left;
|
||||
font-size: 0.75rem;
|
||||
opacity: 0.8;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 社交媒体图标 */
|
||||
.footer-social {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
gap: 0.3rem;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Safari兼容性修复 */
|
||||
.footer-social .md-social__link svg {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* 强制Safari显示SVG图标 */
|
||||
.footer-social .md-social__link {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
/* 内容区域样式 */
|
||||
.footer-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
padding: 0.4rem 0 0;
|
||||
}
|
||||
|
||||
.footer-visit-count {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
backdrop-filter: blur(10px);
|
||||
min-width: 160px;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin-right: 0.5rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.footer-highlight {
|
||||
color: #939ba2;
|
||||
font-weight: 600;
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
|
||||
.icp-link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.icp-link:hover {
|
||||
color: #518FC1;
|
||||
}
|
||||
|
||||
/* 社交媒体图标样式 - 仅桌面端 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: rgba(81, 143, 193, 0.2);
|
||||
border-color: rgba(81, 143, 193, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端社交媒体图标样式 - 恢复默认样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
.footer-social .md-social__link {
|
||||
padding: 0.4rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border-radius: 0;
|
||||
-webkit-transition: color 0.2s ease;
|
||||
transition: color 0.2s ease;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link:hover {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: var(--md-accent-fg-color);
|
||||
}
|
||||
|
||||
.footer-social .md-social__link svg {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
fill: currentColor;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* 导航链接样式 */
|
||||
.md-footer__link {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.md-footer__link:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* 移动端响应式 - 使用 footercopy.html 样式 */
|
||||
@media (max-width: 76.1875em) {
|
||||
/* 隐藏桌面端的卡片式布局 */
|
||||
.footer-visit-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-bottom-section {
|
||||
flex-direction: column;
|
||||
gap: 0.6rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.md-footer-copyright {
|
||||
text-align: center;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.footer-social .md-social__link {
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
|
||||
/* 显示移动端的简洁布局 */
|
||||
.footer-visit-count-mobile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.4em 0.8em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 0.75rem;
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile > * {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link {
|
||||
color: var(--md-footer-fg-color--light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-visit-count-mobile .icp-link:hover {
|
||||
color: #596875;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* .runtime-info {
|
||||
display: none; 移动端隐藏运行时间
|
||||
} */
|
||||
}
|
||||
|
||||
/* 桌面端隐藏移动端布局 */
|
||||
@media (min-width: 76.1875em) {
|
||||
.footer-visit-count-mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.footer-visit-count {
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 深色模式适配 */
|
||||
[data-md-color-scheme="slate"] .md-footer {
|
||||
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-footer-meta {
|
||||
background: linear-gradient(135deg, #020617 0%, #0f172a 100%);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-item:hover {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(81, 143, 193, 0.3);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .footer-social .md-social__link {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user