Тег meter
Тег meter маълум бир қийматни
чиройли қилиб чиқариш учун ишлатилади.
Тегнинг ташқи кўриниши қисман ёки tулиқ бўйалган қирра қилиб кўринади. Қирра яшил, сариқ ёки қизил рангда бўлиши мумкин (қирранинг rанги атрибутларнинг қийматларига боғлиқ, бу ҳақда тўҳирироқ маълумот берамиз):
Тег meter ни, масалан, куйидаги
вазиятда ишлатиш керак: сиз ҳозирги ҳарорат
қийматини экранга чиқармоқчисиз,
бунинг учун ҳарорат 0 дан
100 гача ўзгариши мумкин. Сиз куйидаги
атрибутларни кўрсатишингиз керак: value атрибути
ҳозирги ҳарорат қийматини кўрсатиши керак, min атрибути
- минимал имконiy қийматни (бизнинг ҳолимизда 0), max атрибути - максимал имконiy қийматни (бизнинг ҳолимизда 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 атрибутининг қиймати қайси соҳага
tушишига қараб, қирра яшил ёки
сариқ рангга киради. Яшил ранг агар биз нормал қийматлар соҳаси га тушсак,
сариқ ранг эса - агар юқори ёки паст қийматлар соҳаси га тушсак.
Мисол
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 атрибутининг қийматига қараб
(яъни ҳозирги ҳароратга қараб) қирранинг рангги яшил,
сариқ ёки қизил бўлади.
Агар ҳозирги ҳарорат оптимал ҳароратлар соҳасига тушса (ва биз оптимал совуқ эканлигини кўрсатганмиз), қирранинг ранги яшил бўлади. Агар ҳозирги ҳарорат оптималга яқин бўлган диапазонга тушса (бизнинг ҳолимизда бу нормал ҳарорат), қирра сариқ рангга киради. Агар ҳозирги ҳарорат оптималга яқин бўлмаган диапазонга тушса (бизнинг ҳолимизда бу иссиқ ҳарорат), қирра қизил рангга киради.
Агар оптимал ҳарорат sifatida иссиқни кўрсатсак, ҳамма нареша шунинг ўхшаш бўлади. Бунда, агар ҳозирги ҳарорат иссиқ ҳароратлар соҳасига тушса - қирра яшил бўлади, агар нормал ҳароратлар соҳасига тушса - сариқ, агар совуқ ҳароратлар соҳасига тушса - қизил бўлади.
Агар оптимал sifatida нормал ҳароратни кўрсатсак, қирра факат яшил (агар ҳозирги ҳарорат нормалга тушса) ёки сариқ (агар ҳозирги ҳарорат нормал ҳароратга яқин бўлган соҳага тушса, бу иссиқ ёки совуқ) бўлиши мумкин.
Қайси диапазон оптимал эканлигини кўрсатиш учун,
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 |
Минимал имконiy қийматни белгилайди. Стандарт қиймат: 0. |
max |
Максимал имконiy қийматни белгилайди. Стандарт қиймат: 1. |
low |
Паст қийматлар соҳасининг чегарасини белгилайди. Паст қийматлар min атрибутидаги сондан
low атрибутидаги сонгача бўлади.
|
high |
Паст қийматлар соҳасининг чегарасини белгилайди. Паст қийматлар high атрибутидаги сондан
max атрибутидаги сонгача бўлади.
|
optimum |
Оптимал қийматлар соҳасини аниқлайди. |
Шунингдек кўринг
-
тег
progress,
юкланма қиррасини яратади.