In this article. we are going to set the minimum and maximum value of the range in HTML5 by using the min and max attributes in the <meter> element.
Approach: This can be implemented by using the min and max attributes:
- min: This attribute is used to specify the lower bound of the gauge. The value of the min attribute is always less than the max attribute. It has a default value which is 0.
- max: This attribute is used to specify the upper bound of the gauge. The value of the max attribute must be greater than the min attribute. It has a default value which is 1.
Syntax:
<meter min="number" max="number">
Example: In this example, we will set the maximum and minimum values of the range in HTML5.
HTML
<!DOCTYPE html>
<html>
<body style="text-align:center;">
<h1>GeeksforGeeks</h1>
<h2>
How to set the minimum and
maximum<br>value of the range
in HTML5?
</h2>
Sachin's score:
<meter value="5" min="0" max="10"
high="6">
5 out of 10
</meter>
<br>Laxma sxore:
<meter value="0.5" max="1.0" min="0"
high="0.6">
50% from 100%
</meter>
</body>
</html>
|
Output:
Whether you're preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape,
GeeksforGeeks Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we've already empowered, and we're here to do the same for you. Don't miss out -
check it out now!