Spine 2D骨骼动画环境搭建完全指南:从下载到Runtime接入
做2D骨骼动画最容易被劝退的其实不是K帧而是环境没搭对。我带过不少实习生上来就打开Spine开始拖骨骼结果一到导出环节就炸JSON格式不兼容、纹理打包乱掉、Runtime版本对不上最后还得回头补环境。这篇文章专门讲Spine环境搭建这一件事把从下载安装、许可证激活、界面配置到导出与运行时接通的完整链路说清楚。适合完全零基础的新手也适合带团队的Leader拿来做新人标准化流程参考。1. 为什么把环境搭建当成入门第一课1.1 Spine 到底是什么解决什么问题Spine是一款2D骨骼动画编辑工具核心玩法是把一个角色拆成“骨骼 皮肤贴图”两个层次。动画师不直接一帧一帧画动作而是先给角色搭一套骨骼骨架再通过旋转、移动、缩放骨骼让附着在上面的贴图跟着变形从而产生动画效果。这个思路最大的价值在于复用。传统帧动画要做12张甚至24张连续图才能跑起来一旦角色需要换武器、换衣服所有帧都要重画。Spine动画只需要重新绑定一套贴图骨骼姿态和关键帧动画全部保留换个皮就是新角色。这也是为什么现在2D手游、UI动效、广告短片里Spine几乎成了标配你在大量卡牌游戏、横版动作游戏里看到的待机、攻击、受击动作绝大部分都是Spine做的。但环境搭建往往被低估。很多人以为“装个Spine编辑器”就叫环境就绪了实际上一个完整可用的Spine工作环境至少包含三块编辑器本体、素材处理管线主要是纹理打包相关设置、游戏引擎端的运行时库。三者缺一不可。1.2 环境搭建的真正范围编辑器 素材管线 运行时我把Spine环境整理成了一条链路你可以理解成一条流水线图片素材准备角色拆分、透明PNG导入Spine编辑器划分插槽、附件、骨骼制作动画设置关键帧、约束、权重导出动画数据JSON或二进制和纹理图册在游戏引擎中使用对应的Runtime加载和播放大多数新手卡在第四步和第五步之间。编辑器做出了动画导出时发现纹理图册选项没配对到Unity里动画是花的或者动画数据版本是4.2工程里的Runtime却是3.8直接不能播放。所以正式开工前把这条链走通一遍比什么都重要。环境不是“装好就完”而是“装好且跑通最小示例”才算真正完成。2. 下载安装与版本选型别盲目追新2.1 版本差异Trial、Essentials、Professional 怎么选Spine官方把编辑器分为三个档位评估版Trial、基础版Essentials、专业版Professional。新手经常搞不清楚该买哪个我先给个对比表。版本适用人群核心能力主要限制评估版Trial只想先体验、学操作完整编辑功能导出有水印部分功能在未激活时受限制基础版Essentials小团队、独立开发者、只需基础骨骼动画骨骼动画、关键帧、插槽附件、皮肤不支持网格、权重蒙皮、自由变形、约束等高级功能专业版Professional中大型项目、动画师、需要高级绑定全功能含网格/权重/IK约束/自由变形价格更高我的建议很直接如果是完全零基础先用Trial版跑通流程重点是搞清楚编辑、导出、接入引擎这三个环节自己是否真的需要。确认要持续做动画直接上Professional因为做角色绑定离不开网格和权重Essentials在很多项目里会显得不够用。团队协作场景还有一点要特别注意同一项目组必须统一Spine版本。比如前端已经在用4.2的Runtime开发功能美术那边打开一个4.0保存的项目强行用新版重新保存后旧Runtime很可能就播不了了。版本锁死这件事最好写进项目规范文档。2.2 系统要求与安装步骤Spine编辑器是跨平台桌面应用Windows、macOS、Linux都能跑。新版Spine 4.x已经是原生GUI应用不再需要额外安装Java运行时环境这一点比老版本省心很多。但也别以为装完就能跑几个平台的注意事项还是要提一下。以Windows为例完整步骤如下打开Spine官方网站进入Download页面。选择对应操作系统的安装包Windows下载.exe或.zip版本。下载完成后如果是安装包直接双击运行如果是压缩包解压到固定目录不建议解压到桌面或临时文件夹后续项目路径会扯皮。首次启动时选择登录账号或输入许可证激活。macOS版本是.dmg镜像双击挂载后把Spine.app拖进Applications目录即可。Linux版本一般是.tar.gz解压后直接运行里面的可执行文件。Linux用户容易踩一个坑某些发行版缺少图形库依赖启动时会报libXtst.so.6、libXrender.so.1这类缺失错误。解决方式是根据发行版安装对应的兼容库比如Ubuntu/Debian系执行sudo apt install libxtst6 libxrender1。不要觉得这是个小问题新人卡在启动阶段的概率并不低。2.3 许可证激活与常见坑许可证激活看起来简单实际操作中容易出事。Spine支持两种激活方式账号登录在线激活以及针对无法联网机器的离线激活。我强烈建议普通用户用第一种简单直接。离线激活需要你把机器码发给官方获取激活码步骤繁琐而且换硬件之后许可证容易失效。网上能找到各种“激活工具”的奇怪路子我明确不建议碰一方面Scumware风险高另一方面Spine官方对许可证管理越来越严买到黑key大概率用不了多久就被封。还有一条团队经验每个许可证授权一台工作机。有些团队想省预算让两个人共用一套许可证今天在这台机器激活、明天换那台结果频繁触发官方安全机制账号被临时锁定。省下的钱不够折腾的。3. 编辑器界面与首次配置先认清三块核心区域3.1 布局视口、层级树、属性面板顺利打开Spine之后第一眼看到的是密密麻麻的面板容易懵。别怕核心只需要盯住三块区域。左侧是层级树显示整个角色的结构关系根骨骼、骨骼、插槽、附件、皮肤。右侧是属性面板当你选中层级树里的任何一个对象这里就会显示它的具体参数比如骨骼的坐标、旋转角度、缩放比例插槽的附件列表附件的颜色、混合模式等。中间最大的区域是视口就是你直接观察和操作角色外观的地方它同时也是打关键帧、拖骨骼的主战场。层级树和属性面板的关系可以用一个类比理解层级树管“这角色由哪些零件组成”属性面板管“每个零件现在处于什么状态”。做动画的本质就是在不同时间点修改这些属性然后让Spine自动补齐中间过渡。3.2 骨骼、插槽、附件三个必须搞懂的概念这三个概念是Spine的底层逻辑不搞懂它们后面寸步难行。骨骼是驱动系统它不直接显示图片而是负责提供运动关系。想象一下人的手臂骨骼不是皮肤但它决定了皮肤怎么动。插槽是贴图的“插座”它规定了某个位置可以放哪类图片动画里切换武器、换衣服靠的就是切换插槽里的附件。附件是实际显示的内容通常是图片或网格它填进插槽里才能被看到。用代码开发来类比骨骼就是变量和函数插槽就是接口定义附件就是具体实现。绑定关系清晰了后续换皮、复用动画都轻松。3.3 工作区配置与快捷键正式开工前我建议花五分钟做三件配置。第一关闭自动保存或者设置增量保存。Spine的工程文件是文本格式的复杂项目文件容易变得很大自动保存反而可能造成卡顿或文件损坏。我习惯用CtrlS手动保存并且在项目设置里开启备份生成让Spine每次都生成带时间戳的上一个版本出问题时能回滚。第二调整骨骼显示样式。在视口设置里把骨骼的显示方式改成带名字标签的样式做复杂绑定的时候能一眼看出哪个骨骼是哪根否则层次一多满屏小方块谁也分不清。第三核对工作区颜色。默认背景是深灰如果你习惯在浅色背景下看角色轮廓去偏好设置里改掉。这个小细节很多人不当回事但在长时间K帧之后视觉疲劳是真实存在的。4. 项目结构、素材规范与导出配置4.1 素材准备角色拆分与命名Spine环境搭建里最容易被忽视的是素材规范但项目做到中期80%的混乱都源于素材命名不统一。一套合格的角色拆分素材应当遵循“不、重、明”的原则。不要在一张PNG里放几个原本独立的零件比如手指头和手臂要分开衣服和躯干要分开。重命名要清晰推荐格式为部位_部件_用途比如arm_left_sword.png、body_armor_default.png。明确定层级同一部位的不同皮肤版本建议放同一个文件夹。还有一个硬性要求透明通道一定要保留完整。在PS里导出时不要合并图层时顺手把透明底变成白底或者黑底这会直接导致Spine里出现脏边。推荐导出PNG-24或PNG-32确保Alpha通道无损。4.2 导入与基础绑定在Spine中新建项目后点击导入把拆分好的PNG一次性拖进去。导入时要注意贴图像素尺寸我建议所有部件都使用2的幂次尺寸比如256×256、512×256这样在纹理打包阶段可以减少浪费也能避免部分低端设备表现异常。导入之后开始搭骨架。我的习惯是先搭大骨架再补细节具体顺序是骨盆作为根骨骼往上走出脊椎、胸腔、头部往下走出左右大腿、小腿、脚掌然后再挂手臂。这个顺序符合人体力学直觉后续做走路、跑步动作时更容易调。绑定阶段有个新手容易犯的错误把所有图片直接挂到骨骼上中间跳过插槽。这样做的后果是想做换肤功能时发现无从下手每个部位强耦合。正确做法是先建插槽再把附件放进插槽最后把插槽挂到骨骼上。4.3 导出配置JSON、二进制与纹理图册动画做完进入导出环节。导出参数决定了游戏引擎能否正确读取优先级最高。你需要在导出窗口里做三件主要选择。第一选择数据格式有JSON和二进制.skel两种。JSON可读性高方便调试也方便做版本对比二进制体积小、加载快适合正式发布。我建议开发期用JSON上线前切二进制。第二勾选纹理打包选项。Spine会调用内置的纹理打包器把散落的PNG合并成图册PNG同时生成.atlas描述文件。这个步骤一定要让动画师来配置不要指望程序在引擎里帮你处理散图。第三处理图像透明方式。如果美术在PS里做了预乘Alpha导出时也要对应勾选预乘选项否则贴图边缘会出现难看的黑边或白边。导出完成后正常情况下会得到一组文件数据文件.json或.skel、图册纹理.png图集以及对应的.atlas描述文件。这三个文件就是在引擎侧播放动画的全部家当。5. 接入游戏引擎的运行时准备5.1 Runtime 是什么为什么要提前配好很多人不知道这个问题用Spine做的动画并不能直接在游戏引擎里播放。引擎需要一套解释器来读取Spine导出的数据文件这套解释器就是Spine Runtime。Runtime是官方提供的支持Unity、Godot、Cocos2d-x、libGDX、Phaser等主流框架。环境搭建阶段你必须确认两件事一是项目所用引擎的Runtime版本要匹配编辑器版本二是Runtime的导入方式要符合引擎规范。如果编辑器是4.2Runtime也需要是4.2系列的混用不同大版本会导致动画解析直接崩溃。这里有个更底层的原理可以讲透Spine导出的JSON记录的不是逐帧图片而是“骨骼的姿态变化 关键帧曲线 插槽附件切换指令”。Runtime拿到这套数据后要通过蒙皮计算、网格插值把这些抽象指令实时还原成屏幕上的真动画。所以Runtime不是简单的播放器它是一台实时骨骼计算引擎重要性不亚于编辑器本身。5.2 Unity 快速接入示例Unity是Spine支持最成熟的引擎官方提供了spine-unity包可以通过Package Manager或直接导入.unitypackage来使用。以Unity 2021以上的版本为例标准流程是从Spine官网或GitHub获取对应版本的spine-unity包。打开Unity工程选择Assets菜单下的Import Package导入下载好的包。把Spine导出的JSON、.atlas、图集PNG三个文件放进同一个资源目录。右键创建Spine GameObject选择SkeletonAnimation用于场景中显示或SkeletonGraphic用于UI显示。把JSON拖到Skeleton Data Asset字段自动生成动画组件。接入后在Spine编辑器和Unity之间来回验证手感我的习惯是先在编辑器里用Animation面板检查一遍动作再进Unity播放看混合、换肤效果是否符合预期。如果Unity里动画异常优先排查Data Asset是否加载了正确的JSON以及Runtime版本。5.3 Godot 与其他引擎的接入参考Godot用户可以直接用官方提供的Godot Runtime插件在Asset Library里搜索Spine即可。核心原理和Unity类似都是通过Skeleton播放器节点加载Spine数据文件但需要注意Godot 4和Godot 3对应的插件版本不通用千万别下错。Cocos Creator用户则可以在插件商店找到Spine导入工具导入后会生成对应的Skeleton组件。接入方式虽然略有差异但底层数据格式是一致的只要导出端的版本和Runtime匹配到位剩下的都是插件操作层面的问题。6. 常见问题与排查技巧实录6.1 启动与激活类问题环境搭建阶段最常遇到的三个问题我整理了排查速查表症状可能原因排查方案启动报缺DLL/动态库系统缺少图形相关依赖按官方文档安装对应运行库尤其Linux需要libXtst/libXrender激活后下次启动仍提示未激活许可证被多机登录触发锁定登录官网查看许可证绑定状态必要时联系客服解绑官网下载速度很慢服务器网络波动换时间段重试或使用下载工具续传耐心等待即可我特别想说一个教训不要为了图快到处找所谓“绿色版”“破解版”Spine。这类版本不光有后门风险而且内置的Runtime和导出器版本往往被篡改做完动画拿到Unity里播放各种报错最后浪费的是整个项目的时间。正版Trial版完全够体验全部功能没必要冒这个险。6.2 导出与播放类问题导出后到引擎端播放是问题高发区。常见症状一贴图边缘出现黑边或者白边。这种情况九成是透明通道预乘不匹配。美术在PS里做了预乘Alpha但Spine导出时没有勾选Premultiplied Alpha或者反过来。解决方式是把导出设置和引擎端的透明混合模式统一。常见症状二动画播放出来完全不对角色某些部位飞到屏幕上。排除层级树绑定错误外最常见原因是Runtime版本与导出版本不匹配升级Runtime通常立刻解决。常见症状三图集导出后纹理质量损失。定位在纹理打包参数检查是否开了超过合理范围的压缩或者生成图集尺寸超过了设备上限比如常规Android机型尽量控制2048以内。6.3 路径、命名与项目协作类问题工作目录路径里带中文或者空格正在成为越来越多跨平台项目的隐形杀手。Windows上中文路径在Spine编辑器里没问题但导出到引擎侧尤其是Godot、Cocos后解析atlas文件时非常容易出路径编码错误。我的铁律是Spine项目、导出目录、引擎项目三者的完整路径全部使用英文字符命名用下划线而不是空格。命名不一致也是个高频坑。素材叫hand_L_default.png到了Spine里插槽名变成hand_L_default导出JSON后字段名就对不上换肤系统直接失效。解决思路是在环境搭建阶段就把命名方案写进项目Wiki然后美术和程序共用同一套词汇表。另外多人协作的Spine项目尽可能不要让两个人同时编辑同一个spine工程文件。因为哪怕只改一个关键帧合并冲突都让人头大。推荐方式是拆任务一个人负责绑定和基础待机另一个人负责战斗动作最后再合并进同一个工程。如果公司有条件上版本管理记得开启Spine的增量保存减轻合并压力。写在最后的几点心得环境搭建这件事表面看没什么技术含量实际上它是整个骨骼动画工作流的“地基”。我带项目的时候要求新人必须先把一个最小Demo从Spine一路跑到引擎播放出来才算“环境就绪”。这个标准看起来苛刻了一点但它能筛掉至少一半后续的沟通成本。因为只要有人卡在导出或Runtime问题上美术、程序两头互相甩锅的场景就一定会出现。最后分享一个让我长期受益的小习惯把Spine编辑器、导出目录、引擎Runtime三样东西固定放在同一个开发根的二级目录下面比如GameDev/ArtAssets/SpineOutput然后把这个目录结构从项目一开始就写进团队文档。这样换人、换机器、拉新分支时所有人都能顺着同一套路径找到东西环境搭建真正变成一次配置、到处复用。

相关新闻

雷同即取消奖项是否可行?

雷同即取消奖项是否可行?

雷同即取消奖项是否可行?01 【雷同取消奖项】 很难了,大家都用的那几个公司的硬件库, 底层驱动高度相似多正常, 以及代码检查如何确定他最终比赛用的就是上传的, 会不会一个用于检测一个用于比赛。 板子如果都是抄逐飞…

2026/10/1 11:58:30 阅读更多 →
桥梁裂缝数据集:COCO标注解析、YOLOv8转换与细长目标训练避坑

桥梁裂缝数据集:COCO标注解析、YOLOv8转换与细长目标训练避坑

简介:桥梁裂缝缺陷数据集采用COCO标注格式,是面向计算机视觉研究者和土木工程检测人员的图像分割数据,可用于桥梁裂缝识别、像素级语义分割及智能巡检场景下的模型训练与评估。数据集整体规模约4500张训练图像和200张验证图像;当前…

2026/10/1 11:57:30 阅读更多 →
Codex本地代理配置与/proxies端点故障排查实操指南

Codex本地代理配置与/proxies端点故障排查实操指南

1. 这不是另一个“AI编程助手”教程,而是帮你真正用起来Codex的实操手册Codex这个词最近在开发者圈子里出现频率高得有点反常——不是因为某家大厂又发了新品,而是大量人在安装、配置、调用时卡在同一个地方:cc switch local proxy failed wh…

2026/10/1 11:57:30 阅读更多 →

最新新闻

AI工程从零到一:Prompt、Agent编排到部署避坑全指南

AI工程从零到一:Prompt、Agent编排到部署避坑全指南

前阵子有个老同事找我,说想入门AI,但又不知道从哪下手。我问他手里有什么实际问题要解决,他说“暂时没有,就想先把 ai-engineering-from-scratch 这套东西搞明白”。这句话其实特别典型:想做AI工程的人,十有…

2026/10/1 14:15:43 阅读更多 →
模型推理优化实战:量化、剪枝与ONNX部署全流程解析

模型推理优化实战:量化、剪枝与ONNX部署全流程解析

入行做模型部署这几年,我最大的感受是:训练好的模型就像一块璞玉,不经过打磨直接上生产环境,十有八九会翻车。显存不够、推理延迟高、CPU 上跑不动,这些问题在训练阶段完全看不出来,一上线就全暴露了。这也…

2026/10/1 14:15:43 阅读更多 →
从摄像头到YOLO:实时视觉视频流处理与低延迟优化指南

从摄像头到YOLO:实时视觉视频流处理与低延迟优化指南

我去年第一次正经做一个实时视觉项目的时候,以为最难的会是YOLO模型训练和精度调优,结果真正让我熬夜的却是摄像头那端——画面卡成幻灯片、延迟高到离谱、偶尔还直接黑屏。后来我才想明白一个道理:实时视觉的上限,往往不是模型决…

2026/10/1 14:15:43 阅读更多 →
三层交换机VLAN间路由原理与华为eNSP配置实战

三层交换机VLAN间路由原理与华为eNSP配置实战

三层交换机这个词,几乎是每个网络方向面试的第一道门槛题,也是很多人第一次接触 eNSP 时会卡住的地方。说白了,二层交换机只管同一网段内靠 MAC 地址转发,跨网段就得靠路由,而三层交换机把"交换的速度"和&qu…

2026/10/1 14:15:43 阅读更多 →
老师们,告别熬夜改PPT!这几款AI课件制作工具深度横评

老师们,告别熬夜改PPT!这几款AI课件制作工具深度横评

作为老师,备课、做课件、改作业几乎占据了所有课余时间。尤其是做课件,从收集素材、设计排版、到逐页美化,一套下来动辄几个小时。更头疼的是,同事分享的课件截图、网上找到的优质模板,想二次利用却要手工重做&#xf…

2026/10/1 14:15:43 阅读更多 →
Model-Optimizer全解析:剪枝量化蒸馏协同实现高效模型部署

Model-Optimizer全解析:剪枝量化蒸馏协同实现高效模型部署

机器学习的从业者应该都有过这种体验:模型在训练环境里跑得好好的,Loss 收敛得漂亮,验证集指标也拿得出手,可一旦把它搬到生产环境,要么响应时间超标,要么显存直接爆掉,要么端侧设备根本加载不动…

2026/10/1 14:14:43 阅读更多 →

日新闻

我发现了一个新思路:用 Remotion + Claude Code 像写代码一样自动化生成短视频

我发现了一个新思路:用 Remotion + Claude Code 像写代码一样自动化生成短视频

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/1 0:00:30 阅读更多 →
Windows下 Codex 中 Chrome 和 Computer Use 插件不可用问题排查及解决参考方式:TaoToken 统一 Key 配置与验证

Windows下 Codex 中 Chrome 和 Computer Use 插件不可用问题排查及解决参考方式:TaoToken 统一 Key 配置与验证

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/1 0:00:30 阅读更多 →
黑夜航拍船只数据集训练YOLOV5模型全流程解析

黑夜航拍船只数据集训练YOLOV5模型全流程解析

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/1 1:01:17 阅读更多 →

周新闻

如何划分训练/验证集:Spirula Studio五种eval_mode策略详解

如何划分训练/验证集:Spirula Studio五种eval_mode策略详解

如何划分训练/验证集:Spirula Studio五种eval_mode策略详解 【免费下载链接】spirula-studio Cross-vendor 3D Gaussian Splatting trainer - video to splat to mesh, Vulkan or CUDA. 项目地址: https://gitcode.com/GitHub_Trending/sp/spirula-studio Sp…

2026/9/30 13:14:22 阅读更多 →
SEO怎么推广速查手册新手避坑实战指南

SEO怎么推广速查手册新手避坑实战指南

SEO怎么推广速查手册新手避坑实战指南 模板网站太丑不够用?别急着加滤镜,那是治标不治本。很多老板盯着后台流量掉得眼红,却还在纠结首页Banner的圆角是不是3像素。这就像穿着西装去挖土,姿势不对,努力白费。我整理这份 速查手册…

2026/9/30 18:13:06 阅读更多 →
FireRed-OpenStoryline少样本仿写深度解析:AI Agent如何复刻你的独特文案风格与节奏

FireRed-OpenStoryline少样本仿写深度解析:AI Agent如何复刻你的独特文案风格与节奏

FireRed-OpenStoryline少样本仿写深度解析:AI Agent如何复刻你的独特文案风格与节奏 【免费下载链接】FireRed-OpenStoryline FireRed-OpenStoryline is an AI video editing agent that transforms manual editing into intention-driven directing through natural language …

2026/9/30 13:14:49 阅读更多 →

月新闻

我发现了一个新思路:用 Remotion + Claude Code 像写代码一样自动化生成短视频

我发现了一个新思路:用 Remotion + Claude Code 像写代码一样自动化生成短视频

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/1 0:00:30 阅读更多 →
Windows下 Codex 中 Chrome 和 Computer Use 插件不可用问题排查及解决参考方式:TaoToken 统一 Key 配置与验证

Windows下 Codex 中 Chrome 和 Computer Use 插件不可用问题排查及解决参考方式:TaoToken 统一 Key 配置与验证

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/1 0:00:30 阅读更多 →
黑夜航拍船只数据集训练YOLOV5模型全流程解析

黑夜航拍船只数据集训练YOLOV5模型全流程解析

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/1 1:01:17 阅读更多 →