<meter> Tag in HTML

The <meter> tag in HTML represents a scalar measurement within a known range, often used to display a value within a minimum and maximum range. Common examples include showing a disk usage, completion rate, or battery level. The <meter> tag visually indicates the value by filling a portion of the bar.

Key Points on <meter> Tag:

• The <meter> tag displays a visual representation of a range-bound value.
• Attributes like min, max, value, low, high, and optimum allow customization of the display.
• Commonly used for values like progress tracking, performance levels, and ratings.
• It is different from the <progress> tag, which shows the completion of a task.

Syntax of <meter> Tag:

<meter value="value" min="minimum" max="maximum">Display Text</meter>

Example of <meter> Tag in HTML:

This example shows a meter indicating a battery level at 75% within a range of 0 to 100.

<meter value="75" min="0" max="100">75% Battery</meter>

Attributes of <meter> Tag:

• value: Specifies the current value within the range.
• min: Defines the minimum value for the measurement (default is 0).
• max: Defines the maximum value for the measurement (default is 1).
• low: Indicates the lower bound for a range considered low.
• high: Indicates the upper bound for a range considered high.
• optimum: Specifies the optimum value. It can be used to show preferred or ideal conditions.

The <meter> tag is best used for values within a defined range, like ratings, temperatures, or battery levels, providing a simple way to visually represent these measurements.