HTML5: How to specify a minimum value for an input element?

Last update on February 09 2024 12:52:44 (UTC/GMT +8 hours)

Solution:

HTML Code:

<!DOCTYPE html><!-- Declaration specifying the document type -->
<html><!-- Opening tag for the root element of the HTML document -->
<head><!-- Opening tag for the document's header section -->
<meta charset="utf-8"><!-- Metadata tag specifying the character encoding of the document -->
<title>How to specify a minimum value for an input element</title><!-- Title of the HTML document -->
</head><!-- Closing tag for the document's header section -->
<body><!-- Opening tag for the document's body section -->
<form method="post" action="https://www.w3resource.com/html-css-exercise/basic/solution/input-max-answer-demo.php"><!-- Form element defining a form with method and action attributes -->
  Enter a date before 2010-01-01:
<input type="date" name="day_before" max="2010-12-31"><br><!-- Input field for entering a date before January 1, 2010, with maximum value set to December 31, 2010 -->
  Enter a date after 2015-01-01:
<input type="date" name="day_after" min="2015-01-02"><br><!-- Input field for entering a date after January 1, 2015, with minimum value set to January 2, 2015 -->
  Quantity (between 1 and 5):
<input type="number" name="quantity" min="1" max="5"><br><!-- Input field for entering a number between 1 and 5, inclusive -->
<input type="submit"><!-- Submit button for the form -->
</form><!-- Closing tag for the form -->
</body><!-- Closing tag for the document's body section -->
</html><!-- Closing tag for the root element of the HTML document -->

Explanation:

This HTML code demonstrates how to specify a minimum value for an input element.
Two input fields of type "date" are provided, one with a minimum value and the other with a maximum value.
Additionally, a number input field is included with minimum and maximum values specified.

Live Demo:

See the Pen input-min-answer by w3resource (@w3resource) on CodePen.

See the solution in the browser

Supported browser


Yes	Yes	Yes	Yes	Yes

Go to Exercise page