xBlog 背景相关代码
## 简约平替版： ### 第一步：CSS 代码 - 粘贴到 style.css 文件中 ``` /* ========================================== 动态背景 ============================…
导航栏滚动收缩 CSS代码 JS 代码 迭代记录
## 🎨CSS代码： ### 1. ✅️导航栏滚动收缩样式 - 2026年1月6日 ```css :root { /* 导航栏滚动缩放 */ --header-height-expanded: 135px; --header-height-shrunk: …
前端常见的十一种布局
> 前端布局常见的有很多种，不同的应用场景有不同的布局方式，下面就来简单介绍一下吧。 * 静态布局 * 浮动布局 * 定位布局 * 栅格布局（Grid / CSS Grid） * 表…
代码块 CSS 代码 JS代码 迭代记录
## 🎨CSS 代码： ### 1. 🔄代码块 CSS 样式 - 2026年1月1日 ``` /* ========================================== 代码块 - 需置于 文章详情页 样式下 ============…
导航栏滚动收缩功能迭代代码 2026年1月6日
## 导航栏滚动收缩第一版 ### CSS 代码： ``` :root { /* 导航栏滚动缩放 */ --header-height-expanded: 135px; --header-height-shrunk: 80px; --transition-du…
汇聚 ✈️ YAML
## YAML 文件代码： ```yaml # ====================== # 锚点规则定义 # ====================== rule-anchor: # 订阅配置 更新时间 节点延迟测试时间 P: &P ty…
公用JS函数文件记录
## 兼容版 √ - Edge Chrome + Safari ``` // assets/script.js // ============================= // 全局滚动管理器 // ============================= const S…
通用卡片容器样式记录
## ⭐低性能设备兼容版 ### 1. claude 优化版 √ ```css /* ========================================== 通用卡片容器 - claude优化版 √ =======================…
彻底拆解微软sculpt ergonomic人体工程鼠标
描述症状为：用一段时间就会断链，但是让它休息下就好了。我到手测试发现接收器电脑正常识别，无断链情况，说明问题在鼠标本体身上，猜测某个供电原件过热短路导…
临时笔记
## 控制台测试帧率 ``` // 在控制台执行，查看帧率 (function() { let frameCount = 0; let lastTime = performance.now(); function countFrames() { frameCoun…
博客页面滚动卡顿分析
## 🔴 核心问题 你的页面在 Edge 浏览器上滚动不流畅，主要有以下几个原因： --- ## 1. **CSS 动画与过渡冲突（最严重）** ### 问题代码位置 `style.css` 中的多…