Тег HTML Meter - httpdoc.ru

HTML метр

HTML <meter> был введен в HTML 5. Этот тег используется для определения скалярного измерения в заданном диапазоне. <meter> Элемент используется для представления диапазона , и она не должна быть использована для представления одного числа (например, количество студентов в классе) , если не существует известное максимальное число.

Его также можно использовать для отображения использования диска, количества голосов и т. Д.

Примечание: <счетчик> тег не поддерживается в Internet Explorer, EDGE 12, Safari 5 и более ранние версии.

Атрибуты тега счетчика HTML

Атрибуты Описание
ценить Это обязательный атрибут, который используется для указания значения в числах. Число может быть целым числом или числом с плавающей запятой.
форма В нем указываются формы, к которым принадлежит элемент счетчика.
высокий Он определяет диапазон, который считается высоким значением.
низкий Он определяет диапазон, который считается низким значением.
Максимум Он указывает максимальное значение, определенное в диапазоне.
мин Он определяет минимальное значение, определенное в диапазоне.
оптимальный Он определяет оптимальное значение для датчика. Использование атрибута не обязательно.

Тег счетчика HTML

Пример
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title> HTML Meter Tag </title>
</head>  
<body>

<p>Display a gauge:</p>  

<meter value="50" min="1" max="100"> 50 out of 100 </meter><br>  
<meter value="0.9"> 90% </meter>  

</body>
</html>

Выход

HTML Meter Tag Examples 50 из 100

90%

Тег счетчика HTML с CSS

В этом примере CSS применяется к тегу счетчика. Высота и ширина метки счетчика задаются CSS, который переопределяет значение по умолчанию.

Пример
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title> HTML Meter Tag </title>
<style>
  meter{  
    width: 400px;  
    height: 30px;  
    }  
</style>
</head>
<body>

<meter value="0.9"> 90% </meter>  

</body>
</html>

Выход

HTML Meter Tag Examples 90%

Поддержка браузера

Элемент
Microsoft Edge browser.png Край
Chrome browser.png Хром
Firefox browser.png Fire Fox
Opera browser.png Опера
safari browser.png Сафари
<meter>
да
да
да
да
да