Skip to content
Related Articles

Related Articles

Improve Article

How to set the range that is considered to be a lowest and highest value in HTML5?

  • Last Updated : 26 Mar, 2021

In this article, we will learn how to set the value that would be known as a low and high value of the range. This is done using the low and high attribute. The high attribute is always less than the max attribute value but more than the min attribute and low attribute value. Similarly, the low attribute is always more than the min attribute but less than the max and high attribute value. The meter element will show the value in a different color if it is not within the low and high range.

Syntax:

<meter low="number" high="number">

Example:

HTML




<!DOCTYPE html>
<html>
  <body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>
    <h3>
      How to set the range that is 
      considered to be a lowest and 
      highest value
      in HTML5?
    </h3>
  
    <p>When the value is inside low and high</p>
  
    <meter value="5" min="0" 
           max="10" low="2" high="8">
    </meter>
  
    <p>When the value is below low</p>
  
    <meter value="1" min="0" max="10"
           low="2" high="8">
    </meter>
  
    <p>When the value is over high</p>
  
    <meter value="9" min="0" max="10"
           low="2" high="8">
    </meter>
  </body>
</html>

Output:

Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.




My Personal Notes arrow_drop_up
Recommended Articles
Page :