密码框必须设name和id属性，name用于后端接收字段、id用于label关联；autocomplete需用全小写语义化值（如current-password）；禁用明文回填、https和密码哈希缺一不可。
必须加 name 和 id 属性
没 name 的密码框提交后服务端根本收不到字段，哪怕 DOM 里看着正常。浏览器表单序列化只认 name 键名，PHP 用 $_POST['password']、Node.js 用 req.body.password 都依赖它。id 不是可选：没它就无法用 <label for="xxx"></label> 点击聚焦，无障碍体验和移动端点击精度都会下降。
-
name值别用pwd或pass这类通用名，浏览器和密码管理器更倾向识别password、user_password或current-password -
id必须和label的for值严格一致，大小写敏感 - 绝对不要在模板里用后端变量往
value里塞明文密码（比如编辑用户资料页），容易被日志或 XSS 泄露
autocomplete 值不能乱填
autocomplete="off" 在 Chrome 86+、Edge 90+ 里基本失效，有些版本甚至会把它当 on 处理；Safari 直接报控制台警告。真正起作用的是语义化取值：
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
- 登录页用
autocomplete="current-password"：告诉浏览器“这是已有账号的密码”，允许密码管理器安全填充 - 注册页或改密页用
autocomplete="new-password"：明确提示“这是新设密码”，禁用旧密码复用，防止误填 - 写成
Current-Password或NEW-PASSWORD无效——区分大小写，必须全小写连字符 - 如果表单里只有密码框没用户名框，密码管理器大概率不触发，补上
<input type="text" name="username">或email才完整
移动端和暗色模式的坑
iOS Safari 和部分 Android WebView 对 type="password" 的行为不一致：软键盘可能默认弹数字盘、自动大写首字母、甚至短暂闪现明文。暗色模式下自定义 CSS 容易覆盖浏览器默认背景色，导致文字看不见。
- 加
autocapitalize="off" autocorrect="off" spellcheck="false"关闭干扰输入的系统行为 - 移动端强制全键盘：加
inputmode="text"，别信“密码含数字所以该用inputmode="decimal"”这种说法 - 暗色模式适配时，避免设
background-color: #000，用background-color: transparent或继承父容器色值 - 别用
text-security: disc或caret-color: transparent伪造密码框——value 依然明文可读，且不兼容 Safari
显示/隐藏密码按钮怎么写才安全
切换本质就是改 input.type，不是重渲染 DOM。很多实现 clone 节点或替换整个 input，会导致焦点丢失、光标重置、粘贴异常，还可能让旧节点残留明文在内存里。
- 只做
input.type = input.type === 'password' ? 'text' : 'password'，然后立刻调input.focus() - 按钮图标用内联 SVG，别用字体图标（加载失败就变空白）
- 状态别存 localStorage 或 URL hash，那等于把“当前是否明文”持久化了
- 切换后别在控制台打印
input.value，上线前删调试代码这事，真有人忘
type="password" 就算完了——它不加密、不防 XSS、不拦抓包，连浏览器自动填充都得靠 autocomplete 值来博弈。HTTPS 没配？前端所有防护归零。服务端没哈希？密码明文躺在数据库里。这些环节漏一个，密码框就只是个心理安慰。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
