110 of 133 menu

Тегот meter

Тегот meter се користи за приказ на одредена вредност убавно оформена.

Надворешниот изглед на тегот претставува делумно или целосно обоена лента. Лентата може да биде зелена, жолта или црвена (бојата на лентата зависи од вредностите на атрибутите, за тоа ќе биде понатаму):

Тегот meter треба да се користи, на пример, во следната ситуација: сакате да прикажете на екранот моментална вредност на температурата, при што температурата може да се менува од 0 до 100. Треба да ги наведете следните атрибути: атрибутот value треба да ја означува моменталната вредност на температурата, атрибутот min - минималната можна вредност (во нашиот случај 0), атрибутот max - максималната можна (во нашиот случај 100).

Во зависност од вредноста на атрибутот value лентата ќе биде мала или голема. Ако се наведе value со вредност 10, тогаш лентата ќе биде мала (бидејќи 10 е многу блиску до минимумот - до нула), ако се наведе вредност 90, тогаш лентата ќе биде голема (бидејќи 90 е блиску до максимумот - до 100). Ако се наведе вредност 100 - тогаш лентата ќе го заземе целиот елемент (бидејќи вредноста ја достигна максимумот).

Ако се наведе вредност, поголема од 100, тогаш лентата сепак ќе го заземе целиот елемент. Ако се наведе 0 и помалку - тогаш лента воопшто нема да има.

Пример

Вредноста на атрибутот value мала:

<meter value="10" min="0" max="100"></meter>

:

Пример

Вредноста на атрибутот value голема:

<meter value="90" min="0" max="100"></meter>

:

Пример

Вредноста на атрибутот value средна:

<meter value="50" min="0" max="100"></meter>

:

Пример

Вредноста на атрибутот value еднаква на максималната:

<meter value="100" min="0" max="100"></meter>

:

Пример

Вредноста на атрибутот value еднаква на минималната:

<meter value="0" min="0" max="100"></meter>

:

Пример

Вредноста на атрибутот value поголема од максималната:

<meter value="110" min="0" max="100"></meter>

:

Пример

Вредноста на атрибутот value помала од минималната:

<meter value="-10" min="0" max="100"></meter>

:

Додавање на атрибути low и high

Во тегот meter има уште 2 атрибути: low и high.

Ќе ја разгледаме нивната работа на примерот на температурата. Потсетување, нашата минимална температура е 0, а максималната - 100. Нека сега сакаме да ги направиме следните опсези - "студена температура" од 0 до 20, "нормална" од 20 до 80 и "топла" од 80 до 100.

За да ја поставиме студената температура, ќе ја наведеме вредноста на атрибутот low како број 20. Ќе испадне дека од нула (ова е вредност на атрибутот min) до 20 (вредност на атрибутот low) имаме област на ниски вредности.

За да ја поставиме топлата температура, ќе ја наведеме вредноста на атрибутот high како број 80. Ќе испадне дека од 80 (ова е вредност на атрибутот high) до 100 (вредност на атрибутот max) имаме област на високи вредности.

Нормалната температура ќе биде од 20 (ова е вредност на атрибутот low) до 80 (вредност на атрибутот high). Оваа област ќе ја наречеме област на нормални вредности.

Сега, во зависност од тоа во која област погодува вредноста на атрибутот value, лентата ќе се обои во зелена или жолта боја. Зелена ќе биде, ако погодиме во областа на нормални вредности, а жолта - ако во областа на високи или ниски вредности.

Пример

Вредноста на атрибутот value погодува во областа на ниски вредности:

<meter value="10" min="0" low="20" high="80" max="100"></meter>

:

Пример

Вредноста на атрибутот value погодува во областа на нормални вредности:

<meter value="50" min="0" low="20" high="80" max="100"></meter>

:

Пример

Вредноста на атрибутот value погодува во областа на високи вредности:

<meter value="90" min="0" low="20" high="80" max="100"></meter>

:

Додавање на атрибутот optimum

Атрибутот optimum ја определува оптималната вредност. За нашиот пример оптимална може да биде студена температура, нормална или топла - по ваш избор. Да претпоставиме, дека ќе наведете дека оптимална температура е студената. Сега, во зависност од вредноста на атрибутот value (односно од моменталната температура) бојата на лентата ќе биде зелена, жолта или црвена.

Ако моменталната температура погодува во областа на оптимални температури (а ние наведовме дека оптимална е студената), тогаш бојата на лентата ќе биде зелена. Ако моменталната температура погодува во соседниот со оптималниот опсег (во нашиот случај тоа е нормална температура), тогаш лентата ќе стане жолта. Ако пак моменталната температура погодува не во соседниот со оптималниот опсег (во нашиот случај тоа е топла температура), тогаш лентата ќе стане црвена.

На сличен начин сè ќе се случи, ако оптимална температура се наведе топлата. Во овој случај, ако моменталната температура погоди во областа на топли температури - лентата ќе биде зелена, ако погоди во областа на нормални - жолта, ако во областа на студени - црвена.

Ако оптимална се наведе нормална температура, тогаш лентата може да биде само зелена (ако моменталната температура погоди во нормалната) или жолта (ако моменталната температура погоди во соседот на нормалната температура, а тоа се топла или студена).

За да се наведе, кој опсег е оптимален, треба да се наведе како вредност на атрибутот optimum кој било број од тој опсег.

Во примерите подолу вредноста на атрибутот optimum погодува во областа на ниски вредности (односно студени температури).

Пример

Вредноста на атрибутот value погодува во областа на ниски вредности:

<meter value="10" min="0" low="20" high="80" max="100" optimum="10"></meter>

:

Пример

Вредноста на атрибутот value погодува во областа на нормални вредности:

<meter value="50" min="0" low="20" high="80" max="100" optimum="10"></meter>

:

Пример

Вредноста на атрибутот value погодува во областа на високи вредности:

<meter value="90" min="0" low="20" high="80" max="100" optimum="10"></meter>

:

Во примерите подолу вредноста на атрибутот optimum погодува во областа на високи вредности (односно топли температури).

Пример

Вредноста на атрибутот value погодува во областа на ниски вредности:

<meter value="10" min="0" low="20" high="80" max="100" optimum="90"></meter>

:

Пример

Вредноста на атрибутот value погодува во областа на нормални вредности:

<meter value="50" min="0" low="20" high="80" max="100" optimum="90"></meter>

:

Пример

Вредноста на атрибутот value погодува во областа на високи вредности:

<meter value="90" min="0" low="20" high="80" max="100" optimum="90"></meter>

:


Во примерите подолу вредноста на атрибутот optimum погодува во областа на нормални вредности (односно нормални температури).

Пример

Вредноста на атрибутот value погодува во областа на ниски вредности:

<meter value="10" min="0" low="20" high="80" max="100" optimum="50"></meter>

:

Пример

Вредноста на атрибутот value погодува во областа на нормални вредности:

<meter value="50" min="0" low="20" high="80" max="100" optimum="50"></meter>

:

Пример

Вредноста на атрибутот value погодува во областа на високи вредности:

<meter value="90" min="0" low="20" high="80" max="100" optimum="50"></meter>

:

Стари прелистувачи

Старите прелистувачи нема да можат да го прикажат тегот meter убавно и ќе прикажуваат наместо тоа содржината на самиот тег:

<meter value="10" min="0" max="100">Овој текст ќе се прикаже во стари прелистувачи.</meter>

:

Атрибути

Вредноста на атрибутите може да биде децимален и негативен број.

Атрибут Опис
value Ја поставува моменталната вредност. Задолжителен атрибут.
min Го задава минимално можната вредност. Вредност по основно: 0.
max Го задава максимално можната вредност. Вредност по основно: 1.
low Го задава рабодот на областа на ниски вредности. Ниски вредности ќе бидат од бројот во атрибутот min до бројот во атрибутот low.
high Го задава рабодот на областа на ниски вредности. Ниски вредности ќе бидат од бројот во атрибутот high до бројот во атрибутот max.
optimum Го определува опсегот на оптимални вредности.

Погледнете ги и

  • тегот progress,
    кој создава лента за вчитување.
Македонски
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItaliano日本語ქართულიҚазақ한국어КыргызчаLietuviųLatviešuMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
Ние користиме колачиња за работата на веб-страната, анализа и персонализација. Обработката на податоци се врши во согласност со Политиката за приватност.
прифати ги сите прилагоди одбиј