HTML5 Meter Element Primer Tutorial

HTML5 Meter Element Primer Tutorial

HTML5 Meter Element Primer Tutorial

HTML5 brought with it many great features to front-end work on the internet in HTML, and today we talk about one of the newly introduced, and very useful, elements called “<meter>”.

At its core the “<meter>” element represents a “fraction of one” or perhaps you can think this as a “percentage of one hundred”, and, as you’d guess, a generic “xth of y for the fraction x/y” idea … where “y” could be your “max” parameter, and perhaps your “min” parameter is zero.

This element is useful to represent a numerical concept graphically (like a ratio), something we do today with …

  • simulation of a stopwatch … with its seconds, minutes, hours, days, years elapsed
  • a fraction as (numerator) x / y (denominator)

Tomorrow we’ll show you a very commonplace usage for “<meter>” as a “progress bar” which you see so much of on the internet, when you are waiting for something.

So take a look at the HTML code in meter.html, or a live run, for your perusal. Hope it helps with an HTML project you are on now.

If this was interesting you may be interested in this too.

This entry was posted in eLearning, GUI, Tutorials and tagged , , , , , , , , , , . Bookmark the permalink.

7 Responses to HTML5 Meter Element Primer Tutorial

  1. I am typically to blogging i truly appreciate your articles. This great write-up has truly peaks my interest. Let me bookmark your internet internet site and sustain checking for brand new info.

  2. see post says:

    Truly very helpful standpoint, thanks for posting.. Fantastic ideas you have got here.. I appreciate you expressing your perspective.. Love the posting you given..

  3. Helpful information. Lucky me I discovered your site accidentally, and I’m shocked why this accident didn’t came about earlier! I bookmarked it.

  4. borrow says:

    My internet browsings seem full.. thanks. Is not it superb after you get a good publish? Enjoying the write-up.. thank you Enjoying the weblog.. thanks alot :)

  5. draft kings says:

    Good day! This is my first visit to your blog! We are a team of volunteers and starting a new project in a community in the same niche. Your blog provided us beneficial information to work on. You have done a wonderful job!

Leave a Reply to small scale packaging machine Cancel reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>