从Scratch图形化编程到计算思维:以“接苹果”游戏为例的工程实践
在实际编程教育和技术社区中我们常常会遇到一个有趣的现象一些经验丰富的开发者或计算机专业的学生初次接触 Scratch 这类图形化编程工具时会下意识地产生一种“这太简单了”或“这不是真正的编程”的想法甚至可能带着一丝优越感。这种反应用网络流行语来说就是“轻松绷住”——表面上维持着专业和冷静内心却可能对工具的简单性不以为然。然而这种第一印象往往掩盖了 Scratch 作为一款教育工具的真正深度和它在计算思维培养、项目原型设计乃至跨学科融合中的巨大潜力。对于希望入门编程的青少年、教育工作者或是想快速验证交互逻辑的开发者而言理解 Scratch 背后的设计哲学并掌握其高效用法远比轻视它更有价值。本文将从一名工程实践者的视角重新审视 Scratch。我们不会停留在“拖拽积木”的表面操作而是深入探讨如何像构建一个软件项目一样在 Scratch 中实践模块化设计、事件驱动架构、状态管理和调试技巧。我们将完成一个具备完整功能的小游戏项目并在此过程中解释那些看似简单的积木块背后所对应的核心编程概念如循环、条件、变量、广播消息以及如何将这些概念应用于更复杂的场景。无论你是想为孩子或学生寻找合适的启蒙工具还是想为自己寻找一个快速创意的原型平台这篇文章都将提供一条从“轻松绷住”到“有效利用”的实践路径。1. 重新认识 Scratch不只是拖拽积木在深入动手之前有必要先抛开成见理解 Scratch 的设计目标和它试图解决的问题。这能帮助我们以正确的“工程心态”来使用它而不是仅仅将其视为一个玩具。1.1 Scratch 解决的核心问题降低认知负荷聚焦逻辑本身传统的文本编程入门初学者需要同时面对多重挑战陌生的语法拼写、分号、括号、复杂的开发环境配置、以及抽象的逻辑思维。任何一处的错误比如少一个分号都可能导致程序无法运行挫败感很强。Scratch 通过图形化积木块几乎消除了前两项挑战无语法错误积木块像拼图一样只有形状匹配才能拼接从根本上避免了语法错误。开箱即用的环境在线编辑器或离线客户端提供了包含角色、舞台、声音、画笔等所有元素的集成环境无需配置。这样学习者的全部认知资源都可以集中在问题分解、逻辑流程和算法设计上。这正是“计算思维”的核心。当你看到一段用 Scratch 实现的复杂动画或游戏时其背后蕴含的循环、条件判断、事件监听、消息通信等逻辑与用 Python、Java 编写的程序在本质上并无二致。1.2 Scratch 中的核心概念与编程术语的映射理解这种映射是将其视为“正经”编程工具的关键。下表列出了 Scratch 中的主要概念及其在通用编程中的对应物Scratch 概念对应编程概念解释与示例角色 (Sprite)对象/实例 (Object/Instance)每个角色拥有自己的代码脚本、造型状态和属性坐标、大小、方向等类似于面向对象编程中的对象。舞台 (Stage)主容器/应用上下文背景和全局变量的载体可以放置所有角色并响应全局事件。积木块 (Block)语句/函数调用 (Statement/Function Call)每个积木块代表一个具体的操作或命令如移动 10 步对应sprite.move(10)。脚本 (Script)方法/函数 (Method/Function)由一系列积木块按顺序组合而成完成一个特定任务的一段代码。事件积木(如当绿旗被点击)事件监听器 (Event Listener)用于响应特定事件如启动、按键、广播消息是程序执行的入口点。控制积木(如重复执行,如果...那么)流程控制语句 (Control Flow)实现循环、条件分支等核心逻辑结构。变量变量 (Variable)用于存储和修改数据可以是仅适用于当前角色的“局部变量”也可以是所有角色都能访问的“全局变量”。广播 (Broadcast)与接收消息消息传递/事件驱动通信 (Message Passing / Event-Driven)角色间解耦通信的核心机制。一个角色广播一条消息其他监听该消息的角色会触发相应的脚本。列表数组/列表 (Array/List)用于存储有序的数据集合支持增删改查等操作。克隆 (Clone)对象实例化 (Instantiation)在运行时动态创建角色的副本每个克隆体拥有独立的状态常用于生成大量相似对象如子弹、敌人。理解了这些映射你就会发现在 Scratch 中设计项目本质上就是在进行面向对象和事件驱动的软件设计。下一步我们就来搭建一个项目实践这些概念。2. 环境准备与第一个项目设计“接苹果”游戏我们将通过创建一个经典的“接苹果”游戏来贯穿全文。这个游戏虽然规则简单但涵盖了角色控制、碰撞检测、分数计算、游戏状态管理等多个核心编程概念。2.1 选择并熟悉你的 Scratch 环境你有两个主要选择Scratch 在线编辑器 (推荐初学者)访问 scratch.mit.edu 注册账号后即可使用。优点是不需安装项目自动云存储。Scratch 离线编辑器从官网下载并安装到电脑上。优点是不需要网络运行更流畅。打开编辑器后熟悉以下几个主要工作区舞台区右上角程序的运行结果在这里显示。角色列表区右下角管理所有角色和舞台背景。积木区中间左侧所有可用的积木块分类存放。代码区/脚本区中间主要区域将积木块拖拽到这里组合成脚本。2.2 规划游戏功能与角色在写任何代码之前先进行简单的设计。我们的“接苹果”游戏需要玩家角色一个篮子可以用键盘左右键控制移动用于接住下落的苹果。目标角色苹果从舞台顶部随机位置生成并持续下落。游戏规则篮子接到苹果分数加1苹果消失并在顶部重新生成。苹果落到舞台底部未被接住生命值减1苹果消失并重新生成。生命值减到0游戏结束。游戏元素分数显示、生命值显示、开始/结束界面。根据设计我们需要创建以下角色Basket(篮子)Apple(苹果)可能还需要一个用于显示游戏结束信息的角色或者直接用背景切换来实现。3. 核心实现从角色控制到游戏逻辑现在我们开始为每个角色编写脚本。请跟随步骤并注意理解每个积木块背后的逻辑。3.1 创建并控制玩家篮子 (Basket)首先从角色库中选择或绘制一个篮子角色命名为Basket。目标让篮子响应左右方向键在舞台底部水平移动且不能移出屏幕。当绿旗被点击 重复执行 如果 按键 [左移 v] 是否按下 那么 将x坐标增加 (-10) // 向左移动 end 如果 按键 [右移 v] 是否按下 那么 将x坐标增加 (10) // 向右移动 end 如果 (x坐标) (-220) 那么 // 左边界检查 将x坐标设定为 (-220) end 如果 (x坐标) (220) 那么 // 右边界检查 将x坐标设定为 (220) end end关键解释当绿旗被点击这是程序的主入口点击舞台上的绿旗这个角色下的这段脚本就会开始运行。重复执行构成一个无限循环持续检测按键状态实现平滑控制。这对应了游戏开发中的“游戏循环”。边界检查通过如果...那么和x坐标的判断确保角色不会超出舞台可见范围Scratch 舞台x坐标范围大致是 -240 到 240。这是防御性编程的体现防止出现意外行为。3.2 创建苹果角色并实现下落与生成逻辑 (Apple)绘制或选择一个苹果角色命名为Apple。目标苹果从顶部随机位置出现匀速下落。当碰到篮子或舞台底部时触发不同的事件。我们需要创建两个全局变量用于整个游戏分数用于记录接住苹果的数量。生命用于记录剩余生命值。在“变量”分类中点击“建立一个变量”创建这两个变量并勾选使其显示在舞台上。现在为苹果编写脚本当绿旗被点击 隐藏 // 初始隐藏由克隆体来表现苹果 将 [生命 v] 设定为 [3] 将 [分数 v] 设定为 [0] 重复执行 等待 (1) 秒 // 控制苹果生成频率 建立 [Apple v] 的克隆体 end这段脚本是苹果“本体”的控制器。它初始化游戏状态并每隔1秒克隆一个自己。真正的下落逻辑由每个克隆体来执行。接下来定义克隆体启动时的行为当作为克隆体启动时 显示 移到最前面 将x坐标设定为 (在 (-200) 到 (200) 间随机选一个数) // 随机起始横坐标 将y坐标设定为 (180) // 起始纵坐标在顶部 重复执行直到 (y坐标) (-180) // 直到落到舞台底部附近 将y坐标增加 (-5) // 下落速度 如果 碰到 [Basket v] ? 那么 // 碰撞检测接到苹果 将 [分数 v] 增加 (1) 播放声音 [pop v] // 可选增加音效 删除此克隆体 end end // 如果循环结束即没接到落到底部则扣减生命 将 [生命 v] 增加 (-1) 播放声音 [laser1 v] // 可选失败音效 删除此克隆体关键解释当作为克隆体启动时这是克隆体的专属事件。每个新克隆的苹果都会独立执行这段脚本。重复执行直到...这是一个条件循环只要条件不满足苹果的y坐标大于-180就持续下落。这比简单的重复执行加如果...那么判断更清晰。碰到 [Basket] ?这是 Scratch 内置的碰撞检测。当两个角色的轮廓非矩形边界发生重叠时返回“真”。这是游戏交互的核心。删除此克隆体克隆体完成任务被接住或落地后必须删除以释放资源否则会积累大量隐藏的角色导致程序变慢。这类似于编程中的对象销毁。3.3 添加游戏状态管理目前游戏还没有开始和结束的界面。我们通过背景切换和广播消息来实现一个简单的状态管理。准备两个背景在“背景”库中选择或绘制两个背景例如开始背景和游戏背景。为舞台编写控制脚本当绿旗被点击 切换到背景 [开始背景 v] 停止 [全部 v] // 停止所有角色的脚本 隐藏变量 [分数 v] // 在开始界面隐藏分数显示 隐藏变量 [生命 v] 广播 [开始游戏 v] 并等待 // 等待玩家触发“开始” 当接收到 [开始游戏 v] 将 [分数 v] 设定为 [0] 将 [生命 v] 设定为 [3] 显示变量 [分数 v] 显示变量 [生命 v] 切换到背景 [游戏背景 v] 广播 [游戏开始 v] // 通知所有角色游戏正式开始 当接收到 [游戏结束 v] 停止 [全部 v] // 停止所有游戏逻辑 切换到背景 [开始背景 v] // 或者切换到一个“游戏结束”背景创建一个“开始按钮”角色这个角色在开始背景上显示当被点击时广播开始游戏消息。修改苹果本体的脚本在初始化生命和分数后增加等待直到 (生命) (0)和广播 [游戏结束 v]的逻辑。同时将生成克隆体的循环放在一个重复执行直到 (生命) (0)的循环中。// 在苹果本体脚本中修改 当绿旗被点击 隐藏 等待直到 收到 [游戏开始 v]? // 等待游戏开始信号 将 [生命 v] 设定为 [3] 将 [分数 v] 设定为 [0] 重复执行直到 (生命) (0) 等待 (1) 秒 建立 [Apple v] 的克隆体 end 广播 [游戏结束 v]修改篮子脚本同样将控制逻辑包裹在当接收到 [游戏开始 v]的事件下。通过这种基于消息的通信我们实现了角色间的解耦。舞台作为协调者管理着游戏的全局状态切换。4. 运行验证、调试与优化点击绿旗你应该能看到开始界面。点击开始按钮后游戏开始篮子可控苹果下落分数和生命值正常变化。当生命值为0时游戏停止并回到开始界面。4.1 验证关键功能点请按以下清单检查你的游戏是否运行正常功能点操作预期结果检查方法初始状态点击绿旗显示开始背景分数和生命值隐藏。肉眼观察舞台。开始游戏点击开始按钮切换到游戏背景分数0生命3并显示。篮子出现在底部。观察变量显示器和舞台。篮子移动按下左/右键篮子平滑向左/右移动到达边界后停止。操作并观察。苹果生成游戏开始后每隔约1秒在舞台顶部随机位置出现一个新苹果并下落。观察苹果出现的位置和频率。碰撞得分移动篮子接住苹果苹果消失播放音效如有分数1。观察分数变化和苹果是否消失。失败扣血让苹果落到底部苹果消失播放音效如有生命值-1。观察生命值变化。游戏结束生命值减到0所有角色停止运动背景切换回开始界面。观察舞台是否静止并切换背景。4.2 常见问题与调试技巧即使按照教程操作你也可能会遇到一些问题。以下是典型问题的排查路径问题现象可能原因检查与解决步骤篮子不动1. 脚本没有连接到当绿旗被点击或当接收到 [游戏开始 v]。2. 按键检测积木块选错了按键。3. 角色被锁定或隐藏。1. 检查篮子角色的脚本确保控制循环的脚本块上方有正确的事件积木。2. 双击按键...是否按下积木确认选中的是“左移键”和“右移键”。3. 在角色列表区确保篮子角色眼睛图标是睁开的显示状态。苹果不出现或不下落1. 苹果本体被隐藏且克隆体逻辑有误。2. 克隆体的初始y坐标设得太低或太高在屏幕外。3.重复执行直到循环条件有误导致立即结束。1. 检查苹果本体脚本确认有当绿旗被点击-隐藏。检查克隆体脚本确认第一句是显示。2. 检查克隆体脚本中将y坐标设定为的值建议在 150 到 180 之间。3. 检查重复执行直到 (y坐标) (-180)这个条件。确保是“小于-180”才跳出循环。可以临时在循环内添加说 (y坐标)来观察y坐标变化。接到苹果不加分1. 碰撞检测的对象选择错误。2. 加分和删除克隆体的逻辑放在了错误的位置。1. 检查碰到 [Basket v] ?积木点击下拉箭头确认选中的是Basket角色。2. 确保加分和删除此克隆体在如果 碰到...积木的内部。游戏结束后苹果还在生成游戏结束逻辑没有正确停止苹果本体的克隆循环。检查苹果本体脚本确保生成克隆体的循环重复执行被包裹在重复执行直到 (生命) (0)或能被广播 [游戏结束 v]停止的机制中。舞台在广播游戏结束后使用了停止 [全部]这通常可以停止所有脚本。变量显示不更新或位置不对变量显示框被拖动到舞台外或相互遮挡。在游戏运行时直接用鼠标拖动舞台上的变量显示框到合适位置。调试建议使用“说”积木在怀疑有问题的代码段前后插入说 [xxx]积木可以输出当前状态是最简单的“打印日志”。单步执行在复杂逻辑中可以右键点击代码区选择“单步执行”让程序慢速运行观察每一步的效果。检查角色顺序如果角色间有遮挡可以在脚本中使用移到最前面或图层次序相关的积木来控制显示层级。4.3 优化与扩展建议一个可运行的基础版本完成后可以考虑以下优化这能让你更深入地理解项目设计难度递增随着分数增加让苹果下落速度加快或生成频率变高。这需要引入一个“速度”变量并在克隆体脚本中引用它。多种物品克隆不只是苹果可以创建“炸弹”角色接到会扣分或减生命。这需要为不同克隆体设置不同的“类型”变量并在碰撞检测后根据类型进行不同处理。状态机优化当前用广播消息管理状态比较松散。对于更复杂的游戏可以定义一个全局的游戏状态变量如 0准备1进行中2结束所有角色的行为都根据这个状态变量来决定。数据持久化使用 Scratch 的“云变量”需要登录或本地列表来保存最高分记录。5. 从 Scratch 项目到编程思维的跨越完成这个项目后回顾一下我们实际运用了哪些编程核心概念事件驱动编程整个程序由当绿旗被点击、当按下按键、当接收到消息等事件触发。循环与条件分支使用重复执行、重复执行直到、如果...那么来控制程序流程。变量与数据使用分数、生命变量来存储和更新游戏状态。消息传递与解耦使用广播和当接收到来让角色间通信而不是直接互相调用这使得增加新角色如“炸弹”变得容易。对象与克隆每个苹果克隆体都是独立的“对象”拥有自己的生命周期创建、运行、销毁。碰撞检测实现了基本的物理交互逻辑。这些概念无一不是现代软件工程尤其是游戏开发的基石。Scratch 用可视化的方式让你在解决有趣问题的过程中无痛地理解和实践了它们。当你下次再看到 Scratch 时希望你的“轻松绷住”能转化为一种洞察你看到的不是一个简单的积木玩具而是一个封装了复杂编程范式、旨在降低入门门槛的完整学习环境。对于教育者它是引导学生进入计算思维世界的绝佳桥梁对于开发者它也可以是一个快速验证交互逻辑或算法创意的轻量级原型工具。真正的技术能力不在于使用了多么高深莫测的工具而在于能否用合适的工具清晰、高效地解决问题。

相关新闻

陌生号码来自哪里?用这套免费手机号码定位查询系统,3秒在地图上锁定归属地

陌生号码来自哪里?用这套免费手机号码定位查询系统,3秒在地图上锁定归属地

陌生号码来自哪里?用这套免费手机号码定位查询系统,3秒在地图上锁定归属地 【免费下载链接】location-to-phone-number This a project to search a location of a specified phone number, and locate the map to the phone number location. 项目地址…

2026/10/17 6:45:17 阅读更多 →
手机号码定位免费开源指南:11位数字,3秒在地图上标出归属地

手机号码定位免费开源指南:11位数字,3秒在地图上标出归属地

手机号码定位免费开源指南:11位数字,3秒在地图上标出归属地 【免费下载链接】location-to-phone-number This a project to search a location of a specified phone number, and locate the map to the phone number location. 项目地址: https://git…

2026/10/17 6:45:20 阅读更多 →
手机号码定位查询免费开源系统:3分钟部署,11位号码一键地图定位

手机号码定位查询免费开源系统:3分钟部署,11位号码一键地图定位

手机号码定位查询免费开源系统:3分钟部署,11位号码一键地图定位 【免费下载链接】location-to-phone-number This a project to search a location of a specified phone number, and locate the map to the phone number location. 项目地址: https:/…

2026/10/18 12:39:51 阅读更多 →

最新新闻

零基础也能创建AI智能体:三步搭建个人助手实战指南

零基础也能创建AI智能体:三步搭建个人助手实战指南

身边很多朋友一听到“AI智能体”这个词,第一反应都是:这玩意儿是不是得先学三个月Python,再搞懂什么API调用、微调模型,才配碰一碰?其实真不是。我刚开始接触的时候也抱着同样的刻板印象,直到我自己用纯聊天…

2026/10/18 16:49:44 阅读更多 →
JSP篇之JSP基础语法

JSP篇之JSP基础语法

JSP简介 (图片来源:慕课网) 常见的动态网站开发技术对比 (图片来源:慕课网) JSP页面元素简介以及page指令 JSP元素的构成 (图片来源:慕课网) 指令: JSP指…

2026/10/18 16:49:43 阅读更多 →
佳能相机SDK开发指南:从工业视觉接入到RAW实时处理

佳能相机SDK开发指南:从工业视觉接入到RAW实时处理

简介:本资源为佳能官方相机SDK开发套件,面向Windows平台C/VB开发者,用于构建远程控制、参数调节与图像采集类摄影应用,解决专业相机集成开发中API调用、库链接与环境配置等核心问题。压缩包共854个文件,174.44MB&#…

2026/10/18 16:49:43 阅读更多 →
高通平台音频驱动实战:从ASoC到音频DSP的完整链路

高通平台音频驱动实战:从ASoC到音频DSP的完整链路

刚接手高通平台安卓音频驱动开发时,我一度以为主要工作是改内核设备树、调codec寄存器。真正动手才发现,最耗时间的不是写代码,而是先把一条声音从APP到喇叭的完整链路弄清楚。高通平台的音频驱动和教科书里标准Linux ASoC架构有挺大区别&…

2026/10/18 16:49:43 阅读更多 →
ABS轮速传感器原理与故障排查:从磁电式到霍尔式的信号解读

ABS轮速传感器原理与故障排查:从磁电式到霍尔式的信号解读

简介:这是一份系统讲解ABS车轮速度传感器基本结构与工作原理的技术文档,适合汽车维修技师、汽车电子专业学生及对ABS系统感兴趣的从业者学习参考。资源包内含1个doc文档,压缩包整体仅226KB,聚焦轮速传感器的核心知识模块&#xff…

2026/10/18 16:49:43 阅读更多 →
Nacos 2.4.3 服务端部署实战:从单机到集群的落地指南

Nacos 2.4.3 服务端部署实战:从单机到集群的落地指南

简介:nacos-server-2.4.3.zip 是面向微服务开发者与运维人员的 Nacos 服务端发行包,对应 2.4.3 版本,可用于搭建服务注册与发现、动态配置管理及服务元数据管理平台,兼容 Spring Cloud、Dubbo、Kubernetes 等主流微服务生态&#…

2026/10/18 16:48:43 阅读更多 →

日新闻

基于GMM的语音识别系统原理与MATLAB实现详解

基于GMM的语音识别系统原理与MATLAB实现详解

说到基于高斯混合模型(GMM)的语音识别系统,很多人第一反应就是一堆数学公式,觉得门槛很高。但如果你真的在MATLAB里把它落地跑通,会发现核心其实就是三件事:把声音变成特征向量,用GMM给每个类别…

2026/10/18 0:00:55 阅读更多 →
数字图像处理入门:反白、灰度化、调色板修改与导出txt实践

数字图像处理入门:反白、灰度化、调色板修改与导出txt实践

数字图像处理这四个字听起来挺唬人,但落到具体操作上,无非就是让计算机按你的想法“摆弄”像素。我在一个模拟项目X里用了一套特别经典的基础处理流程:对图像做反白、改调色板、彩色转灰度,最后把像素数据导出成txt文件。单看每一…

2026/10/18 0:00:55 阅读更多 →
机器人大脑技术盘点:具身智能的感知、决策与数据闭环

机器人大脑技术盘点:具身智能的感知、决策与数据闭环

如果你的信息流最近也天天刷到“机器人大脑”这个词,你会发现一个很有意思的现象:每个人说的“大脑”根本不是同一个东西。有人指的是大语言模型,有人指的是运动控制系统,还有人指的是能理解物理世界的端到端模型。在2026年这个时…

2026/10/18 0:00:55 阅读更多 →

周新闻

基于GMM的语音识别系统原理与MATLAB实现详解

基于GMM的语音识别系统原理与MATLAB实现详解

说到基于高斯混合模型(GMM)的语音识别系统,很多人第一反应就是一堆数学公式,觉得门槛很高。但如果你真的在MATLAB里把它落地跑通,会发现核心其实就是三件事:把声音变成特征向量,用GMM给每个类别…

2026/10/18 0:00:55 阅读更多 →
数字图像处理入门:反白、灰度化、调色板修改与导出txt实践

数字图像处理入门:反白、灰度化、调色板修改与导出txt实践

数字图像处理这四个字听起来挺唬人,但落到具体操作上,无非就是让计算机按你的想法“摆弄”像素。我在一个模拟项目X里用了一套特别经典的基础处理流程:对图像做反白、改调色板、彩色转灰度,最后把像素数据导出成txt文件。单看每一…

2026/10/18 0:00:55 阅读更多 →
机器人大脑技术盘点:具身智能的感知、决策与数据闭环

机器人大脑技术盘点:具身智能的感知、决策与数据闭环

如果你的信息流最近也天天刷到“机器人大脑”这个词,你会发现一个很有意思的现象:每个人说的“大脑”根本不是同一个东西。有人指的是大语言模型,有人指的是运动控制系统,还有人指的是能理解物理世界的端到端模型。在2026年这个时…

2026/10/18 0:00:55 阅读更多 →

月新闻

我发现了一个新思路:用 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/18 0:55:02 阅读更多 →
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/17 17:22:31 阅读更多 →
黑夜航拍船只数据集训练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/18 12:16:16 阅读更多 →