HTML Mender
一个专为本地HTML文件设计的可视化编辑器，用于修改和美化网页内容。
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：HTML Mender。 它的用途是：一个专为本地HTML文件设计的可视化编辑器，用于修改和美化网页内容。 完整的 Skill 内容见：https://321skill.com/skills/html-mender/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
‘帮我用HTML Mender打开本地的 `presentation.html` 幻灯片文件，把标题字体调大，背景色改成浅蓝色，并在最后一页加上一个感谢观看的动画。’，它会加载该文件进入可视化编辑模式，让你通过点选和参数面板完成上述样式调整，并预览动画效果，最后保存修改。
介绍
HTML Mender 解决了用户需要直接编辑和美化本地HTML文件，但又不想深入代码细节的痛点。它提供了一个直观的图形界面，允许用户像使用设计软件一样，通过拖拽、点击等方式直接修改网页的样式、布局和内容，特别适合处理那些结构固定但需要快速调整的HTML页面。
使用方式非常简单：用户只需在AI对话中指定要编辑的本地HTML文件路径，HTML Mender便会加载该文件并提供一个可视化编辑界面。用户可以在界面中直接修改文本、调整CSS样式、添加或删除元素，所有更改都会实时反映在预览中，编辑完成后可以保存为新的HTML文件。
这个工具非常适合前端开发初学者、UI设计师、内容创作者以及需要频繁修改课件讲义或演示文稿的高校学生和教师。他们无需精通HTML/CSS代码，也能快速完成网页的视觉调整和内容更新。
建议用户在使用前备份原始HTML文件，因为编辑是直接作用于文件本身的。此外，该工具主要针对静态HTML的视觉层调整，对于涉及复杂JavaScript交互或动态数据绑定的页面，其编辑能力可能有限，更适合用于最终成品的外观微调。
核心特点
与同类代码编辑器或在线设计工具不同，HTML Mender专注于本地静态HTML文件的可视化编辑，无需联网或上传，直接在本地环境中提供所见即所得的修改体验，尤其擅长处理AI生成的幻灯片HTML或单页演示文稿的快速美化。
注意事项
不适合编辑包含复杂JavaScript交互、动态数据绑定或需要后端逻辑处理的网页。
常见问题
HTML Mender能编辑在线网页吗？
不能，它仅支持编辑本地保存的.html文件。
编辑后会改变HTML文件的结构吗？
会，它会根据可视化操作生成对应的HTML和CSS代码，可能改变原有结构，建议先备份。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/html-mender/raw/index.md 读取 HTML Mender 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/html-mender/raw/index.md（查看排版版本）