HTML
HTML标记编写、审查与修复专家
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：HTML。 它的用途是：HTML标记编写、审查与修复专家 完整的 Skill 内容见：https://321skill.com/skills/html-x-8/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
'这个表单的提交按钮点击后没有反应，请检查HTML代码'，它会分析表单结构，修复缺失的type属性或action属性，并确保标签正确关联。再如：'屏幕阅读器读不出这个模态框的内容'，它会检查aria-*属性、焦点管理和role，给出完整的可访问性修复方案。
介绍
该技能专注于解决HTML标记层面的各类问题：表单提交失败、标签绑定无效、自动填充错误、验证时机异常；屏幕阅读器读取不当、焦点丢失、模态框escap问题；图片加载页面跳动、Quirks模式渲染、乱码显示；表格内容溢出、未闭合标签导致全局样式异常；链接预览、favicon、富结果缺失；<dialog>、<details>、popover、<template>行为异常；iframe或视频嵌入空白；HTML邮件在Outlook中崩溃；以及需要安全渲染不受信任HTML的场景。覆盖响应式图片、资源提示、lang/dir、Web Components和HTML验证。使用时，直接描述你遇到的HTML问题或需要完成的标记任务，技能会分析并给出修复方案或直接生成正确的HTML代码。适合前端开发、全栈工程师、内容创作者、邮件设计师等需要处理HTML标记的人员。建议在遇到具体HTML行为异常时优先使用，而非用于样式调整或JavaScript逻辑调试。注意：该技能不处理CSS布局、DOM脚本、SEO策略或Markdown转换。
核心特点
与通用代码审查技能不同，该技能深度聚焦HTML语义、可访问性、表单行为、嵌入媒体及XSS安全，能精准诊断并修复仅与标记结构相关的微妙问题，如autofill错位、屏幕阅读器跳过、modal焦点丢失等。
注意事项
不适用于CSS样式与布局、JavaScript DOM操作、SEO排名策略及Markdown格式处理。
常见问题
HTML表单提交按钮点击无反应怎么办？
检查`<form>`是否有`action`和`method`属性，`<button>`或`<input type="submit">`是否在表单内，并确保没有JavaScript错误阻止提交。
如何让HTML邮件在Outlook中正常显示？
使用表格布局、内联样式、避免CSS浮动和Flexbox，添加`<!--[if gte mso 9]>`条件注释，并测试兼容性。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/html-x-8/raw/index.md 读取 HTML 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/html-x-8/raw/index.md（查看排版版本）