Атрибут HTML – min

Атрибут min (мінімум) визначає мінімальне значення, що є прийнятним і дійсним для поля, що містить цей атрибут. Якщо value елемента не досягає значення min, то елемент провалює валідацію. Це значення повинно бути меншим або рівним значенню атрибута max.

Частина типів полів мають усталений мінімум. Якщо поле не має усталеного мінімуму і для min задано значення, що не може бути перетворено на дійсне число (або мінімальне значення не задано), то поле не має мінімального значення.

Цей атрибут прийнятний для типів полів, серед яких date, month, week, time, datetime-local, number and range, а також елемент <meter>.

Синтаксис

Синтаксис значень min для різних типів полів
Тип поля Синтаксис Приклад
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 <number> <input type="number" min="0" step="5" max="100">
range <number> <input type="range" min="60" step="5" max="100">

Примітка: Коли дані, введені користувачем, не відповідають заданому мінімальному значенню, то значення поля вважається неприйнятним при валідації обмежень і дає збіг з псевдокласами :invalid і :out-of-range.

Дивіться докладніше у Валідації на клієнтському боці та rangeUnderflow.

У випадку елемента <meter> атрибут min визначає нижню числову межу вимірюваного діапазону. Це значення повинно бути меншим за мінімальне значення (атрибут max), якщо воно задане. В обох випадках у разі відсутності цього атрибута береться усталене значення 1.

Синтаксис значень min для інших елементів
Тип поля Синтаксис Приклад
<meter> <number> <meter id="fuel" min="0" max="100" low="33" high="66" optimum="80" value="40"> at 40/100</meter>

Вплив на step

Значення min і step визначають те, що є прийнятними значеннями, навіть якщо атрибута step немає, адже усталено step дорівнює 0.

Додамо велику червону межу навколо неприйнятних полів:

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

Тоді визначмо поле з мінімальним значенням 7.2, пропустивши атрибут step, тож усталено його значення дорівнює 1.

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

Оскільки step усталено дорівнює 1, серед прийнятних значень 7.2, 8.2, 9.2 і так далі. Значення 8 не є прийнятним. Оскільки додано неприйнятне значення, браузери, що це підтримують, виділять це значення як неприйнятне.

Якщо явно це не задати, step усталено дорівнює 1 для number і range, а також 1 одиниці вимірювання (секунді, тижню, місяцю, дню) для полів введення дат і часу.

Занепокоєння щодо доступності

Надавайте користувачам інструкції, щоб їм було легше заповнити форму та користуватися окремими її елементами. Позначайте всі обов'язкові та необов'язкові поля, формати даних та іншу доречну інформацію. При використанні атрибута min переконайтеся, що такий мінімум зрозумілий користувачам. Достатньо може бути додавання інструкцій в підписах. Якщо інструкції надаються поза підписами, що дає змогу застосовувати до них гнучкіші позиціювання та дизайн, розгляньте варіант використання aria-labelledby або aria-describedby.

Специфікації

Якщо ви це бачите — значить, щось трапилося з цією сторінкою.
Якщо ви це бачите — значить, щось трапилося з цією сторінкою.

Сумісність із браузерами

Якщо ви це бачите — значить, щось трапилося з цією сторінкою.
desktop mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on iOS Samsung Internet
min
Chrome Full support 6
Edge Full support 18
Firefox Full support 16
Internet Explorer No support Ні
Opera Full support 11
Safari Full support 6
WebView Android No support Ні
Chrome Android Full support 18
Firefox for Android Full support 16
Opera Android Full support 11
Safari on iOS Full support 10.3
Samsung Internet Full support 1.0

Дивіться також