HTML
HTML标记编写、审查与修复
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：HTML。 它的用途是：HTML标记编写、审查与修复 完整的 Skill 内容见：https://321skill.com/skills/html-x-4/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
'我有一个表单，点击提交按钮后页面刷新但数据没有发送到服务器，请帮我检查HTML代码。' 它会分析表单的action、method、输入框的name属性以及提交按钮的type，指出缺失的name属性或错误的form标签闭合，并修复代码。
介绍
您是否遇到过表单字段无法提交、标签无响应、自动填充错位或验证时机错误？您的屏幕阅读器是否读出了文件名、焦点跳出模态框，或者页面因图片加载而跳动、出现乱码、表格文本溢出？当您需要修复未闭合标签导致的整页斜体、缺失的链接预览、favicon或富结果，以及 <dialog>、<details>、popover、<template> 行为异常、iframe或视频嵌入空白、HTML邮件在Outlook中崩溃，或需要安全渲染不可信HTML时，这个Skill都能帮您快速定位并解决问题。
使用时，只需将存在问题的HTML代码或页面描述提供给AI，并说明具体症状。AI会分析代码结构，检查语义化标签使用、表单关联、ARIA属性、文档头信息、响应式图片、资源提示、语言方向属性等，并给出修复建议或直接生成修正后的代码。它还能处理Web Components、验证HTML规范合规性，以及防范XSS攻击。
本Skill适合所有需要编写、调试或优化HTML的前端开发、全栈开发、文档工程师和技术写作者。无论您是正在构建新页面、重构遗留代码，还是排查复杂的可访问性或跨浏览器兼容性问题，都能从中获得精准帮助。
建议在使用时提供具体的代码片段或页面URL，并明确描述期望的行为与当前异常。注意：本Skill专注于HTML标记本身，不处理CSS样式布局、JavaScript DOM脚本、SEO策略或Markdown内容。对于样式和交互问题，请配合使用对应的CSS或JavaScript Skill。
核心特点
与同类技能相比，本Skill深入覆盖HTML语义结构、表单可访问性、文档头优化、媒体嵌入及XSS防御等完整领域，并提供针对 `<dialog>`、`<details>`、popover、`<template>` 等现代HTML元素的专门调试能力，而非仅做基础语法检查。
注意事项
不适用于CSS样式和布局问题、JavaScript DOM脚本编写、SEO排名策略优化以及Markdown格式转换。
常见问题
如何修复HTML表单提交失败的问题？
检查表单的action属性、method属性，确保提交按钮类型为submit，且没有使用JavaScript阻止默认行为。AI会分析代码并给出具体修复方案。
如何让屏幕阅读器正确读取页面内容？
添加正确的ARIA标签、为图片提供alt文本、使用语义化标签（如<nav>、<main>、<article>），并确保焦点管理正确。AI可以审查代码并给出改进建议。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/html-x-4/raw/index.md 读取 HTML 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/html-x-4/raw/index.md（查看排版版本）