মিটার ট্যাগ
meter ট্যাগটি কিছু মানকে
সুন্দরভাবে সজ্জিত করে প্রদর্শনের জন্য ব্যবহার করা হয়।
ট্যাগটির বাহ্যিক appearance একটি আংশিকভাবে বা সম্পূর্ণরূপে রঙিন দণ্ডের মতো। দণ্ডটি সবুজ, হলুদ বা লাল হতে পারে (দণ্ডের রং অ্যাট্রিবিউটের মানের উপর নির্ভর করে, এটি নিচে বর্ণনা করা হবে):
meter ট্যাগটি ব্যবহার করা উচিত, উদাহরণস্বরূপ,
নিম্নলিখিত পরিস্থিতিতে: আপনি বর্তমান তাপমাত্রা প্রদর্শন করতে চান,
যেখানে তাপমাত্রা 0
থেকে 100 পর্যন্ত পরিবর্তিত হতে পারে। আপনার নিম্নলিখিত
অ্যাট্রিবিউটগুলি নির্দিষ্ট করা উচিত: value অ্যাট্রিবিউটটি
বর্তমান তাপমাত্রার মান নির্দেশ করবে, min
অ্যাট্রিবিউটটি - সর্বনিম্ন সম্ভাব্য মান (আমাদের
ক্ষেত্রে 0), max অ্যাট্রিবিউটটি - সর্বোচ্চ
সম্ভাব্য মান (আমাদের ক্ষেত্রে 100)।
value অ্যাট্রিবিউটের মানের উপর নির্ভর করে
দণ্ডটি ছোট বা বড় হবে। যদি
value এর মান 10 নির্দিষ্ট করা হয়,
তবে দণ্ডটি ছোট হবে (কারণ 10
সর্বনিম্ন মান - শূন্যের খুব কাছাকাছি), যদি
90 মান নির্দিষ্ট করা হয়, তবে দণ্ডটি
বড় হবে (কারণ 90 সর্বোচ্চ মানের
কাছাকাছি - 100)। যদি 100 মান নির্দিষ্ট করা হয় - তবে
দণ্ডটি সম্পূর্ণ এলEMENT জুড়ে থাকবে (কারণ মান
সর্বোচ্চে পৌঁছেছে)।
যদি 100-এর বেশি মান নির্দিষ্ট করা হয়,
তবুও দণ্ডটি সম্পূর্ণ এলEMENT জুড়ে থাকবে।
যদি 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ট্যাগ,
যা একটি লোডিং বার তৈরি করে।