HTML 属性:min

min 属性定义对于包含该属性的输入可接受且有效的最小值。如果元素的 value 小于此值,则该元素未通过 validation。该值必须小于或等于 max 属性的值。

¥The min attribute defines the minimum value that is acceptable and valid for the input containing the attribute. If the value of the element is less than this, the element fails validation. This value must be less than or equal to the value of the max attribute.

某些输入类型具有默认最小值。如果输入没有默认最小值,并且为 min 指定的值无法转换为有效数字(或未设置最小值),则输入没有最小值。

¥Some input types have a default minimum. If the input has no default minimum and a value is specified for min that can't be converted to a valid number (or no minimum value is set), the input has no minimum value.

它对输入类型有效,包括:datemonthweektimedatetime-localnumberrange 类型以及 <meter> 元素。

¥It is valid for the input types including: date, month, week, time, datetime-local, number and range types, and the <meter> element.

语法

¥Syntax

Syntax for min values by input type
输入类型 语法 示例
date yyyy-mm-dd <input type="date" min="2019-12-25" step="1">
month yyyy-mm <input type="month" min="2019-12" step="12">
week yyyy-W## <input type="week" min="2019-W23" step="">
time hh:mm <input type="time" min="09:00" step="900">
datetime-local yyyy-mm-ddThh:mm <input type="datetime-local" min="2019-12-25T19:30">
number <input type="number" min="0" step="5" max="100">
range <input type="range" min="60" step="5" max="100">

注意:当用户输入的数据不符合最小值设置时,该值在约束验证中被视为无效,并将与 :invalid:out-of-range 伪类匹配。

¥Note: When the data entered by the user doesn't adhere to the min value set, the value is considered invalid in constraint validation and will match the :invalid and :out-of-range pseudo-classes.

有关详细信息,请参阅 客户端验证rangeUnderflow

¥See Client-side validation and rangeUnderflow for more information.

对于 <meter> 元素,min 属性定义测量范围的数字下限。如果指定,该值必须小于最大值(max 属性)。在这两种情况下,如果省略,则该值默认为 1。

¥For the <meter> element, the min attribute defines the lower numeric bound of the measured range. This must be less than the maximum value (max attribute), if specified. In both cases, if omitted, the value defaults to 1.

Syntax for min values for other elements
输入类型 语法 示例
<meter> <meter id="fuel" min="0" max="100" low="33" high="66" optimum="80" value="40"> at 40/100</meter>

对步数的影响

¥Impact on step

minstep 的值定义什么是有效值,即使不包括 step 属性,因为 step 默认为 0

¥The value of min and step define what are valid values, even if the step attribute is not included, as step defaults to 0.

我们在无效输入周围添加一个大红色边框:

¥We add a big red border around invalid inputs:

css
input:invalid {
  border: solid red 3px;
}

然后定义一个最小值为 7.2 的输入,省略 step 属性,其中默认为 1。

¥Then define an input with a minimum value of 7.2, omitting the step attribute, wherein it defaults to 1.

html
<input id="myNumber" name="myNumber" type="number" min="7.2" value="8" />

由于 step 默认为 1,因此有效值包括 7.28.29.2 等。值 8 无效。由于我们包含了无效值,因此支持的浏览器会将该值显示为无效。

¥Because step defaults to 1, valid values include 7.2, 8.2, 9.2, and so on. The value 8 is not valid. As we included an invalid value, supporting browsers will show the value as invalid.

如果未明确包含,则 step 对于 numberrange 默认为 1,对于日期/时间输入类型默认为 1 种单位类型(秒、周、月、日)。

¥If not explicitly included, step defaults to 1 for number and range, and 1 unit type (second, week, month, day) for the date/time input types.

无障碍问题

¥Accessibility concerns

提供说明以帮助用户了解如何填写表单并使用各个表单控件。指示任何必需和可选的输入、数据格式和其他相关信息。使用 min 属性时,请确保用户理解这一最低要求。在 <label> 内提供说明可能就足够了。如果在标签之外提供说明,可以更灵活地定位和设计,请考虑使用 aria-labelledbyaria-describedby

¥Provide instructions to help users understand how to complete the form and use individual form controls. Indicate any required and optional input, data formats, and other relevant information. When using the min attribute, ensure this minimum requirement is understood by the user. Providing instructions within the <label> may be sufficient. If providing instructions outside of labels, which allows more flexible positioning and design, consider using aria-labelledby or aria-describedby.

规范

Specification
HTML Standard
# attr-input-min
HTML Standard
# attr-meter-max

¥Specifications

浏览器兼容性

¥Browser compatibility

html.elements.input.min

BCD tables only load in the browser

html.elements.meter.min

BCD tables only load in the browser

也可以看看