HTML max attribute
In HTML max attribute it specifies the maximum value of an element. when the max attribute is used by the progress element, it specifies how much work the task requires in the total task.
Syntax
<element max="value" >Supported Tags:
The max attribute is used on the following elements:
Name | Description |
|---|---|
Maximum value or limit for a parameter or variable. | |
The highest possible measurement value on a metering device. | |
The maximum level of advancement or completion reached in a process. |
HTML max attribute Examples
Example: In this example we demonstrates the use of the max attribute in an input field, limiting the input to multiples of 5 up to a maximum value of 100.
<!DOCTYPE html>
<html>
<body>
<h2>HTML max Attribute in Input Field</h2>
<form id="myGeeks">
<input type="number"
id="myNumber"
step="5"
name="geeks"
placeholder="multiples of 5" max="100" />
</form>
<br />
<br />
<p style="font-size: 20px">
The maximum value for an input field
is 100.
</p>
</body>
</html>
Output:
HTML max attribute Example Output
Example 2: This Example we are using the max attribute within the <progress> tag to indicate a maximum value of 100 for a song download progress bar.
<!DOCTYPE html>
<html>
<head>
<title>max Attribute</title>
</head>
<body>
<h2>
HTML max Attribute used in Progress
Tag
</h2>
Downloading progress for a song:
<progress value="50" max="100">
</progress>
</body>
</html>
Output:
HTML max attribute example output
Supported Browsers: The browser supported by HTML max Attribute are listed below:
HTML max attribute – FAQs
Which input types support the max attribute?
The max attribute is supported by number, range, date, datetime-local, month, time, and week input types.
What happens if the input exceeds the max attribute value?
If the input exceeds the max value, the form will not be submitted, and the browser may display a validation message. JavaScript can also be used to provide custom validation messages.
Is the max attribute required?
No, the max attribute is not required. It is optional and used only when you need to specify an upper limit for the input value.
How does the max attribute affect date and time inputs?
For date and time inputs, the max attribute sets the latest date or time that can be selected. Example:
<input type="date" max="2024-12-31">
What is the default value of the max attribute if it is not specified?
If the max attribute is not specified, there is no maximum limit enforced by the browser for the input value.
