输入属性
value/readonly/disabled/placeholder/required/pattern/min/max 等
输入属性
<input> 有丰富的属性来控制输入行为、验证格式、限制范围。
学完本章你将： 掌握 value/placeholder/required/readonly/disabled/pattern/min/max 等。
值相关
html
<!-- 默认值 -->
<input type="text" value="默认内容">
<!-- 占位提示（输入后消失） -->
<input type="text" placeholder="请输入用户名">
<!-- 只读（可选中，不可改） -->
<input type="text" value="不可修改" readonly>
<!-- 禁用（灰色，不提交） -->
<input type="text" value="不可交互" disabled>验证相关
html
<!-- 必填 -->
<input type="text" required>
<!-- 正则验证 -->
<input type="text" pattern="[A-Za-z]{3,10}"
title="3-10位英文字母">
<!-- 数字范围 -->
<input type="number" min="1" max="100" step="5">
<!-- 字符长度 -->
<input type="text" minlength="3" maxlength="20">其他实用属性
html
<!-- 自动聚焦 -->
<input type="text" autofocus>
<!-- 自动完成 -->
<input type="text" autocomplete="username">
<input type="password" autocomplete="current-password">
<!-- 多选（file / email） -->
<input type="file" multiple>
<input type="email" multiple> <!-- 多个邮箱用逗号分隔 -->
<!-- 文件类型限制 -->
<input type="file" accept=".jpg,.png,.pdf">
<!-- 输入框尺寸 -->
<input type="text" size="30"> <!-- 可见宽度 30 字符 -->