HTML
专注HTML标记编写、审查与修复
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：HTML。 它的用途是：专注HTML标记编写、审查与修复 完整的 Skill 内容见：https://321skill.com/skills/html-x-2/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
'检查这段HTML，修复表单提交不响应的问题，确保所有input都有对应的label，并让屏幕阅读器能正确读出验证错误信息。' 它会分析表单结构，补充缺失的`for`属性和`aria-describedby`，修正`button`的`type`，并为错误提示添加`role="alert"`，最终生成可正常提交且无障碍友好的代码。
介绍
这个Skill专门解决HTML标记层面的各种问题。当表单字段提交失败、标签无法触发焦点、自动填充选错输入框、验证时机错乱时；当屏幕阅读器读出了文件名、某些元素完全不播报、焦点在模态框中丢失时；当页面因为图片加载而跳动、浏览器进入怪异模式、出现乱码（mojibake）时；当表格内容溢出、一个未闭合的标签导致半个文档变成斜体、链接预览或favicon缺失时；当<dialog>、<details>、popover或<template>行为异常、iframe或视频嵌入空白、HTML邮件在Outlook中崩溃、以及需要不受信任的HTML安全渲染（防止XSS）时——这个Skill都能提供精准的修复。
使用方式非常简单：将你的HTML代码或问题描述提供给AI，它会自动分析并给出修复方案。你可以要求“检查这个页面的HTML语义是否正确”、“修复表单提交不响应的问题”、“为所有图片添加响应式属性”或“确保HTML邮件在Outlook中正常显示”。Skill会逐行审查标记，补全缺失的lang/dir属性、优化<head>中的资源提示、规范<form>的action/method、添加aria-*属性提升可访问性，并对<template>、<slot>等Web组件提供正确用法。
适合前端开发人员、文档工程师、测试工程师以及任何需要编写或维护HTML内容的用户。无论是日常开发中排查HTML语法错误，还是对现有页面进行无障碍改造，抑或是制作兼容多客户端的邮件模板，这个Skill都能显著提升效率。对于内容创作者，它还能帮助修复富文本编辑器生成的混乱标记，确保排版一致。
使用建议：提交问题时应尽量提供完整的HTML片段或上下文，包括<head>中的元数据。如果问题涉及CSS样式或JavaScript逻辑，请使用对应的“css”或“javascript”Skill，本Skill不处理这些部分。对于XSS安全场景，请确保已经理解最终输出的上下文，AI会协助进行转义和过滤，但建议结合安全审查机制。
核心特点
与通用的HTML生成或修复工具不同，这个Skill聚焦于语义结构、可访问性、表单行为、邮件兼容等细节问题，能精准诊断并修复从屏幕阅读器误读到Outlook渲染崩溃的各类具体故障，而非泛泛地生成或优化代码。
注意事项
不适用于CSS样式和布局、JavaScript DOM脚本、SEO排名策略以及Markdown内容。
常见问题
这个Skill能修复CSS问题吗？
不能，本Skill只处理HTML标记，不涉及CSS样式或布局，建议使用对应的css Skill。
能处理JavaScript动态生成的HTML吗？
可以，但需要提供最终生成的HTML源码或相关上下文，AI会基于静态标记进行分析；若涉及运行时行为，建议配合javascript Skill。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/html-x-2/raw/index.md 读取 HTML 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/html-x-2/raw/index.md（查看排版版本）