La etiqueta “meter”, permite graficar una cantidad en base a un rango mínimo y máximo.
La sintaxis es:
<meter min=”0” max=”100” value=”50”></meter>
Min: Valor mínimo del rango
Max: Valor máximo del rango
Value: Valor actual.
Esta etiqueta nos puede servir para mostrar de forma gráfica cantidades, por ejemplo;
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Elmento Meter</title> </head> <body> <p>Espacio disponible en el disco duro:<br> <meter min="0" max="100" value="70"></meter>70%</p> </body> </html>
Este elemento tiene parámetros adicionales, que permiten cambiar la apariencia del control, estos son:
High: indica a partir de que cantidad se considera un valor alto.
Low: indica a partir de que cantidad se considera un valor bajo.
Optimum. Indica la cantidad optima del rango, se muestra en color verde
Ejemplo:
<p>Tempretauras</p> <p>Ciudad de México <meter min="0" max="50" high="35" low="15" optimum="25" value="10"></meter> </p> <p>Guadalajara <meter min="0" max="50" high="35" low="15" optimum="25" value="25"></meter></p> <p>Tuxtla Gutierrez <meter min="0" max="50" high="35" low="15" optimum="25" value="40"></meter></p>
