min和max属性用于限定number输入框的数值范围，影响验证与微调按钮行为；配合step可实现步进控制；值须为合法数字字符串，且需注意格式与默认值一致性。

在HTML5中，min 和 max 属性可直接作用于 <input type="number"> 元素，用于限定用户可输入或通过上下箭头选择的数值范围。它们不仅影响表单验证，还会影响浏览器原生控件（如微调按钮）的行为。

基础用法：设置最小值与最大值

只需为 number 类型输入框添加 min 和 max 属性，并赋予合法数字值即可：

这样用户无法输入小于 10 或大于 100 的数字，点击上下箭头时也会被限制在此区间内。

配合 step 属性实现精确步进

单独使用 min/max 只限制边界，若希望用户只能选特定间隔的值（如 5 的倍数），需加上 step 属性：

Wechat Article Html

将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。

下载

立即学习“前端免费学习笔记（深入）”；

此时有效值为 0、5、10…50。若省略 step，默认为 1；设为 step="any" 则允许任意精度小数（但仍受 min/max 约束）。

注意类型与格式一致性

min/max 的值必须是有效数字字符串，不支持表达式或变量：

• ✅ 正确：min="3.14"、max="-5"
• ❌ 错误：min="2+3"、max="Math.max(10,20)"
• ⚠️ 小数点需用英文句点，min="3,14" 会被忽略

验证与用户体验补充建议

min/max 触发浏览器原生验证，但仅在提交或调用 checkValidity() 时生效。为提升体验，可补充以下做法：

• 添加 value 属性设默认值，且确保其落在 min/max 范围内
• 用 oninput 或 onchange 监听实时输入，手动截断越界值（兼容性更强）
• 配合 required 使用时，空值会触发必填提示，而非范围提示