必须设置type和name属性：type="password"隐藏字符，name确保后端接收数据；autocomplete需显式设为current-password或new-password；pattern、minlength仅前端校验，inputmode="text"优化移动端全键盘调出。
type="password" 是唯一必需的设置，其他都是增强项；不设 name 就等于没写这个字段——表单提交时它直接消失。
必须写的两个属性：type 和 name
浏览器只靠 type="password" 就能隐藏字符，但若漏掉 name，哪怕用户输了一百遍密码，POST 或 GET 提交时后端也收不到任何值。这不是 bug，是 HTML 表单规范：无 name 的控件不参与序列化。
示例写法：
<input type="password" name="password">
额外建议加 id，方便后续用 JS 获取或关联 <label for="pwd"></label>，但不是强制。
autocomplete 不能靠默认，得显式控制
Chrome 86+、Edge 90+ 会主动尝试填充已保存的密码，哪怕你没写 autocomplete，只要 type="password" 就可能触发。这不是“记住密码”功能被误用，而是浏览器把所有密码框都当成潜在的登录/改密入口。
-
autocomplete="off"多数情况有效，但部分新版 Chrome 会忽略 -
autocomplete="new-password"更可靠，明确告诉浏览器：“这是注册页或重置页的新密码，别填旧的” -
autocomplete="current-password"仅用于登录页的“当前密码”输入框（比如修改密码前的身份确认） -
autocomplete="false"完全无效，浏览器根本不识别这个值
pattern 和 minlength 是体验层，不是安全层
它们只在前端校验，用户禁用 JS、绕过表单、用 curl 直接发请求，这些约束就形同虚设。
常见组合示例：
<input type="password" name="password" minlength="8" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="至少8位，含数字+小写字母+大写字母">
注意点：
-
pattern不支持正则标志（如/i），大小写必须写成[a-zA-Z]或分开断言 -
title属性必须提供，否则浏览器出错提示可能是英文默认文案，且部分移动端不显示 -
minlength是 HTML5 原生属性，比用 JS 写校验更轻量，但依然可被绕过
移动端软键盘适配常被忽略
iOS 和 Android 对 type="password" 默认倾向调出数字/符号键盘，导致用户要切好几次才能输入大小写字母+数字+符号的密码。
解决方法是加 inputmode="text"：
<input type="password" name="password" inputmode="text">
这个属性不改变语义（仍是密码框），只影响软键盘布局，强制弹出全键盘。2026 年主流 WebView（Chrome、Safari、Webview 127+）均已稳定支持。
真正容易被忽略的是：很多人加了 inputmode 却忘了测试真机——模拟器里看不出软键盘行为差异，只有在 iPhone 或 Pixel 实机上点一下才知有没有生效。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
