HTML tutorial
CSS3 tutorial
Bootstrap tutorial
JavaScript tutorial
JQuery tutorial
AngularJS tutorial
React tutorial
NodeJS tutorial
PHP tutorial
Python tutorial
Python3 tutorial
Django tutorial
Linux tutorial
Docker tutorial
Ruby tutorial
Java tutorial
C tutorial
C ++ tutorial
Perl tutorial
JSP tutorial
Lua tutorial
Scala tutorial
Go tutorial
ASP.NET tutorial
C # tutorial
For <button>, <input> and <option> elements, the value attribute specifies the initial value of the element."
For <button>
,
<input>
and <option>
elements, the
value
attribute specifies the initial value of the element.
For <li>
elements, the
value
attribute sets the value of the list item (for
ordered lists). The next list items will increment from that value.
For <meter>
elements, the
value
attribute specifies the current value of the
gauge.
For <progress>
elements, the
value
attribute specifies how much of the task has been completed.
For <param>
elements, the
value
attribute specifies the value of the
parameter.
The value
attribute can be used on the following elements:
Elements | Attribute |
---|---|
<button> | value |
<input> | value |
<meter> | value |
<li> | value |
<option> | value |
<progress> | value |
<param> | value |
Two buttons with equal names, that submit different values when clicked:
<form action="/action_page" method="get">
Choose your favorite subject:
<button name="subject" type="submit" value="fav_HTML">HTML</button>
<button name="subject" type="submit" value="fav_CSS">CSS</button>
</form>
An HTML form with initial (default) values:
<form
action="/action_page">
First name: <input type="text" name="fname"
value="John"><br>
Last name:
<input type="text" name="lname"
value="Doe"><br>
<input type="submit" value="Submit form">
</form>
Use of the value attribute in an ordered list:
<ol>
<li value="100">Coffee</li>
<li>Tea</li>
<li>Milk</li>
<li>Water</li>
<li>Juice</li>
<li>Beer</li>
</ol>
A gauge with a current value, min, max, high, and low segments:
<meter min="0" low="40" high="90" max="100" value="95"></meter>
A drop-down list inside an HTML form:
<form action="/action_page">
<select name="cars">
<option value="volvo">Volvo XC90</option>
<option value="saab">Saab 95</option>
<option value="mercedes">Mercedes SLK</option>
<option value="audi">Audi TT</option>
</select>
<input type="submit" value="Submit">
</form>
Downloading in progress:
<progress value="22" max="100"></progress>
Set the "autoplay" parameter to "true", so the sound will start playing as soon as the page loads:
<object data="horse.wav">
<param name="autoplay" value="true">
</object>
The value
attribute has the following browser support for each element:
Element | |||||
---|---|---|---|---|---|
button | Yes | Yes | Yes | Yes | Yes |
input | 1.0 | 2.0 | 1.0 | 1.0 | 1.0 |
li | Yes | Yes | Yes | Yes | Yes |
meter | 8.0 | 13.0 | 6.0 | 6.0 | 11.0 |
option | Yes | Yes | Yes | Yes | Yes |
progress | 8.0 | 10.0 | 16.0 | 6.0 | 11.0 |
param | Yes | Yes | Yes | Yes | Yes |