Simple HTML

Mari Simon had a great tweet the other day about nothing but HTML, no CSS or JavaScript goodies. Just good old HTML. I wanted to see the results of the HTML, so here it is.

Colour Picker

HTML

<input type="colour" id="color-picker" name="color-picker" value="#e66465">
<label for="color-picker">Pick a color</label>

Result

Progress Bar

HTML

<label for="file">File progress:</label>
<progress id="file" max="100" value="70"> 70% </progress>

Result

Meter Tag

HTML

<meter id="fuel" min="0" max="100" low="33" high="66" optimum="80" value="50">at 50/100</meter>

Result

Input Search

HTML

<label for="site-search">Search the sites:</label>
<input type="search" id="site-search" name="q" aria-label="Search through site content">

Result

Start attribute in ordered lists

HTML

<ol start="79">
<li>Slowpoke</li>
<li>Slowbro</li>
<li>Magnemite</li>
<li>Magneton</li>
</ol>

Result

79. Slowpoke
80. Slowbro
81. Magnemite
82. Magneton

Original Tweet