The type attribute assigns additional features or behavior to an HTML element.
There are 8 different HTML elements that accept a type attribute.
These include <input>, <button>, <script>, <link>, and more.
A form with <input> elements of different type: text, email, checkbox, and submit.
<form action="/tutorial/action.html">
<fieldset style="border: 2px solid #4238ca; background: #f6f8ff; ">
<legend>Mortgage application</legend>
<input type="text" placeholder="First name" name="firstname"><br /><br />
<input type="text" placeholder="Last name" name="lastname"><br /><br />
<input type="email" placeholder="Email" name="email"><br /><br />
<div>
<input type="checkbox" id="self" name="self" value="self">
<label for="self">Self-employed</label>
</div>
<input type="submit" value="Submit" />
</fieldset>
</form>
For buttons, the type attribute sets the type of button: submit, reset, etc.
For input elements, the type attribute sets the type of <input>: text, radio, password, etc.
And there are several other elements that accept type -- they are listed below.
For details on the input tag, see our HTML input Tag Reference.
The type attribute can be applied to the following elements.
| Elements | Attribute | Values |
|---|---|---|
| <button> | type | submit, reset, or button |
| <input> | type | button, checkbox, color, date, datetime-local, email, file, hidden, image, month, number, password, radio, range, reset, search, submit, tel, text, time, url, or week |
| <link> | type | A media type such as text/html or text/css. |
| <script> | type | A media type such as application/javascript or application/ecmascript. |
| <source> | type | A media type such as video/mp4 or audio/mpeg. |
| <embed> | type | A media type such as image/jpg or application/pdf. |
| <object> | type | A media type such as image/jpg or application/pdf. |
| <style> | type | A media type, but only text/css is valid. |
Tip: In some cases, the type value is a media type (formerly MIME type).
See the IANA Media Types website for a complete list of media types.
Two <button> elements; one of type submit, the other of type reset.
<form action="/tutorial/action.html">
First name <br />
<input type="text" name="firstname"> <br />
Last name <br />
<input type="text" name="lastname"> <br /> <br />
<input type="submit" value="Submit"> <input type="reset"><br />
</form>
For details on the <button> tag, see our HTML button Tag Reference.
Three different <input> elements with types text, checkbox, and submit respectively.
<form action="/tutorial/action.html">
First name <br />
<input type="text" name="firstname"><br />
Last name <br />
<input type="text" name="lastname"><br />
<div style="margin:20px 0;">
<input type="checkbox" id="accept" name="accept" checked>
<label for="accept">Accept terms</label>
</div>
<input type="submit">
</form>
For details on <input>, see our HTML input Tag Reference.
A <link> element referencing a stylesheet with a text/css media type.
<link type="text/css" rel="stylesheet" href="/style.css">
Note: in HTML5, the type is optional for a link with rel="stylesheet". The default is text/css.
For details on the link tag, see our HTML link Tag Reference.
A <script> element with JavaScript specifying an application/javascript media type.
<p id="demo"></p>
<script type="application/javascript">
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
Note: In HTML5, the type is optional for script.
The default is application/javascript.
For details on the <script> tag, see our HTML script Tag Reference.
Two <source> tags with different media types: audio/ogg and audio.mpeg.
<audio controls>
<source src="/media/epic.mp3" type="audio/mpeg">
<source src="/media/epic.wav" type="audio/wav">
Your browser does not support audio. Please upgrade.
</audio>
For details on the <source> tag, see our HTML source Tag Reference.
A <style> element with a text/css media type.
<style type="text/css">
.corn {color: brown; background:cornsilk; padding:20px;}
</style>
<div class="corn">A styled div element.</div>
Note: In HTML5, the type is optional for the style tag.
The default is text/css.
For details on the style tag, see our HTML style Tag Reference and CSS tutorial.
Support for the type attribute is universal.
| <button> | <input> | <link> | <style> | <script> | <source> | <object> | <embed> | |
 Chrome
|
Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes |
 Firefox
|
Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes |
 IE/Edge
|
Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes |
 Opera
|
Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes |
 Safari
|
Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes |
