星号（）本身无语义，不算必填提示；必须同时设置required属性（或aria-required="true"）和视觉标记（如label内含）才构成有效必填提示。
HTML表单里星号（*）到底算不算必填提示
不算。浏览器和读屏软件完全不认你手写的 *，它只是个普通文本字符，既不会触发校验，也不会被辅助技术识别为“必填”含义。
常见错误现象：设计师在 label 末尾加了红色 *，开发没配 required 属性或 aria-required="true"，结果表单能空提交，视障用户根本不知道该填哪几项。
- 必须同时满足两个条件才算真正“必填提示”：HTML 层面有
required属性（或后端校验逻辑），视觉层有可感知的标记（比如*） -
*本身没有任何语义，不能替代required或aria-required - 如果只加
*不加required，纯键盘用户或读屏用户会直接跳过这个字段，以为它可选
aria-required="true" 和 required 属性怎么选
优先用原生 required，aria-required="true" 只在无法修改 HTML 结构时当补救手段。
使用场景：你接手的旧系统用 JS 动态生成表单，input 元素没写 required，但业务逻辑上它必须填——这时候才加 aria-required="true" 告诉读屏软件“这玩意儿得填”，但它**不会阻止空提交**，校验还得你自己写 JS。
-
required是 HTML 原生属性：触发声控、自动聚焦、表单提交拦截、基础无障碍支持 -
aria-required="true"是 ARIA 补充声明：仅影响读屏播报，对浏览器行为零影响 - 两者同时存在没问题，但别只写
aria-required而漏掉required - 注意兼容性：
aria-required在老版本 IE + JAWS 组合下可能被忽略，required支持更稳
星号（*）放 label 里还是外面？CSS 怎么不干扰可访问性
星号必须放在 <label></label> 元素内部，且不能用 aria-hidden="true" 隐藏，否则读屏会跳过它——哪怕你视觉上把它染成红色、缩小字号，它也得是 label 文本的一部分。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
错误做法：用伪元素 ::after 插入 *，或者把星号塞进 <span aria-hidden="true">*</span> —— 这两种方式都会导致读屏完全读不到“必填”信号。
- 正确写法：
<label>姓名 <span class="required-star">*</span></label>，然后用 CSS 控制.required-star样式 - 不要给星号加
aria-hidden，哪怕它只是装饰；它属于 label 的语义内容 - 如果星号颜色太浅（比如 #ccc），色觉障碍用户可能看不见，建议搭配文字提示（如“（必填）”）或图标（需带
aria-label）
后端校验已存在，前端还用管 aria-required 吗
要管。后端校验只防数据出错，不防体验断裂——用户填完一整页再弹“姓名不能为空”，比实时提示差十倍，尤其对认知障碍或移动端用户。
容易踩的坑：觉得“反正后端拦着呢”，于是前端连 required 都不加，label 也没星号，JS 校验也懒得起，结果表单交互像黑盒。
-
required是最低成本的用户引导，浏览器原生支持，零 JS 也能工作 - 如果字段逻辑必填但类型是
type="hidden"或动态显示/隐藏，就得靠aria-required+ JS 手动同步状态 - 记住：可访问性不是“加了就完事”，而是确保“不同操作方式（鼠标/键盘/语音/读屏）得到一致反馈”
最常被忽略的是 label 和 input 的绑定关系——for 和 id 对不上，或者用了包裹式 label 却忘了删 for，这时候哪怕星号、required、aria-required 全齐，读屏照样找不到关联字段。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
